From 666c61a8dca571045e422e6c85f1b7a8179f0df5 Mon Sep 17 00:00:00 2001
From: liuyg <376836862@qq.com>
Date: Wed, 29 Dec 2021 13:41:37 +0800
Subject: [PATCH] +搜索确认按钮位置 加上展开,  适应1366 768分辨率的缩放zoom ,

---
 src/views/securityGuard/securityGuard.vue |  147 ++++++++++++++++++++++++++++++++++++------------
 1 files changed, 110 insertions(+), 37 deletions(-)

diff --git a/src/views/securityGuard/securityGuard.vue b/src/views/securityGuard/securityGuard.vue
index f997a1d..9cd362c 100644
--- a/src/views/securityGuard/securityGuard.vue
+++ b/src/views/securityGuard/securityGuard.vue
@@ -20,6 +20,8 @@
         ]"
       >
         <avue-crud
+          class="tablesss"
+          :key="option.height"
           :option="option"
           :search.sync="search"
           :table-loading="loading"
@@ -168,7 +170,7 @@
               :type="type"
               v-if="permission.securityGuard_delete && row.status != 2"
               @click.stop="rowStatus(row)"
-              >离职登记
+              >离职
             </el-button>
             <el-button
               icon="el-icon-edit"
@@ -397,6 +399,7 @@
     </el-col>
     <div
       :class="[
+        'downSFZ',
         $store.state.control.windowWidth >= 1024
           ? 'downSFZqudong'
           : 'downSFZqudongS',
@@ -601,6 +604,12 @@
         callback();
       }
     };
+    // let table = document.getElementsByClassName("tablesss");
+    // let heard = table[0].getElementsByClassName("avue-crud__search");
+    // let usNum =
+    //   this.windowWidth <= 1376 && this.windowHeight <= 778 ? 170 : 332;
+    // // that.option.height = +h - (+heard[0].clientHeight + 332);
+    // let optionHeight = +this.windowHeight - (+heard[0].clientHeight + +usNum);
     return {
       sort: "",
       sortName: "",
@@ -750,6 +759,8 @@
       },
       choiceList: [],
       option: {
+        searchIndex: 5, //收缩展示数量
+        searchIcon: true, //搜索是否收缩
         height: "auto",
         calcHeight: 80,
         tip: true,
@@ -997,12 +1008,14 @@
                 label: "保安员证编号",
                 prop: "securitynumber",
                 hide: true,
-                display:true,
-                rules: [{
+                display: true,
+                rules: [
+                  {
                     required: false,
                     message: "请输入保安员证编号",
                     trigger: "blur",
-                  }],
+                  },
+                ],
               },
               // {
               //   label: "发证日期",
@@ -1275,19 +1288,54 @@
           },
         ],
       },
+      tablevisible: true,
+      isNotChangeSize: true, //取消表格loging
     };
   },
   watch: {
-    // windowHeight() {
-    //   let d = {
-    //     option: this.option,
-    //     fn: function () {
-    //       console.log(123);
-    //     },
-    //     add: 100,
-    //   };
-    //   this.$store.dispatch("WHchangeHight", d);
-    // },
+    windowHeight() {
+      let that = this;
+      that.isNotChangeSize = false; //取消表格loging
+      let d = {
+        fn: function (h) {
+          let table = document.getElementsByClassName("tablesss");
+          let heard = table[0].getElementsByClassName("avue-crud__search");
+          let usNum =
+            that.windowWidth <= 1376 || that.windowHeight <= 778 ? 170 : 302;
+          // // that.option.height = +h - (+heard[0].clientHeight + 332);
+          // alert(h);
+          let doit = (height) => {
+            let hs = height || h;
+            // alert(hs);
+            // alert(heard[0].clientHeight);
+            // alert(usNum);
+            that.option.height = +hs - (+heard[0].clientHeight + +usNum);
+            that.$nextTick(() => {
+              that.refreshChange();
+              setTimeout(() => {
+                let d = {
+                  that: this,
+                  otherclass: ["downSFZ"],
+                  haveOpen: true,
+                };
+                //刷新表格后再次调整按钮
+                that.$store.dispatch("TABLE_CHANGEBUTPOSITION", d);
+                that.isNotChangeSize = true; //恢复表格loging
+              }, 10);
+            });
+          };
+          if (that.option.height == "auto") {
+            //解决第一次未渲染成功会报错的问题
+            setTimeout(() => {
+              doit(window.innerHeight);
+            }, 150);
+          } else {
+            doit();
+          }
+        },
+      };
+      this.$store.dispatch("WHchangeHight", d);
+    },
     radio() {
       if (this.radio) {
         this.SFZloding = true;
@@ -1306,31 +1354,34 @@
         this.initData(this.form.tenantId);
       }
     },
-    "form.hold":{
-      handler(val){
-        var securitynumbercolumn =this.findObject(this.option.group,'securitynumber')
+    "form.hold": {
+      handler(val) {
+        var securitynumbercolumn = this.findObject(
+          this.option.group,
+          "securitynumber"
+        );
         // console.log(val,1234);
-        if(val==1){
-          securitynumbercolumn.display=true;
-          securitynumbercolumn.rules=[
-                  {
-                    required: true,
-                    message: "请输入保安员证编号",
-                    trigger: "blur",
-                  }
+        if (val == 1) {
+          securitynumbercolumn.display = true;
+          securitynumbercolumn.rules = [
+            {
+              required: true,
+              message: "请输入保安员证编号",
+              trigger: "blur",
+            },
           ];
-        }else{
-          securitynumbercolumn.display=false;
-          securitynumbercolumn.rules=[
-                  {
-                    required: false,
-                    message: "请输入保安员证编号",
-                    trigger: "blur",
-                  }
+        } else {
+          securitynumbercolumn.display = false;
+          securitynumbercolumn.rules = [
+            {
+              required: false,
+              message: "请输入保安员证编号",
+              trigger: "blur",
+            },
           ];
         }
       },
-      immediate: true
+      immediate: true,
     },
     "form.fingerprint"() {
       let that = this;
@@ -1371,7 +1422,7 @@
             }
           });
         };
-        
+
         setTimeout(() => {
           // var iframeDom = document.getElementById("zhiwen");
           //   console.log(iframeDom,111111);
@@ -1395,7 +1446,7 @@
     },
   },
   computed: {
-    ...mapGetters(["userInfo", "permission", "windowHeight"]),
+    ...mapGetters(["userInfo", "permission", "windowHeight", "windowWidth"]),
     permissionList() {
       return {
         addBtn: this.vaildData(this.permission.securityGuard_add, false),
@@ -1483,6 +1534,15 @@
     }
   },
   mounted() {
+    // let d = {
+    //   that: this,
+    //   otherclass: ["downSFZ"],
+    //   haveOpen: true,
+    //   flowHeight: 332,
+    // };
+    // this.$store.dispatch("TABLE_CHANGEBUTPOSITION", d);
+    // console.log((this.$refs.crud._props.option.height = 200));
+    this.changeButsPosition("TABLE_CHANGEBUTPOSITION");
     // this.option.column[0].hide = true
     // 非保安单位模式默认加载管理组数据
     if (!website.tenantMode) {
@@ -1498,6 +1558,17 @@
     // this.olondSFZ(); //检查身份证设备是否存在
   },
   methods: {
+    changeButsPosition(val) {
+      let d = {
+        that: this,
+        otherclass: ["downSFZ"],
+        haveOpen: true,
+        from: "mounted",
+      };
+      // 开始就适应高度
+      this.$store.commit("setWindowSizeHeightAdd");
+      this.$store.dispatch("TABLE_CHANGEBUTPOSITION", d);
+    },
     openccc() {
       console.log(this.zhiwenImg);
       // console.log(this.zhiwenChart);
@@ -2477,6 +2548,9 @@
       this.onLoad(this.page, this.query);
     },
     onLoad(page, params = {}) {
+      if (this.isNotChangeSize) {
+        this.loading = true;
+      }
       params = this.search;
       var that = this;
       //获取当前登录人员的角色信息
@@ -2569,7 +2643,6 @@
             ...that.query,
           };
 
-          that.loading = true;
           getList(page.currentPage, page.pageSize, values).then((res) => {
             const data = res.data.data;
             that.page.total = data.total;

--
Gitblit v1.9.3