fix: 调整表格列弹框的展开位置

src/views/personStrucManage/components/list.vue

@@ -48,7 +48,40 @@
       @row-click="rowClick"
     >
       <el-table-column :selectable="handleSelectWithDifferentStatus" type="selection" width="55" fixed align="center" />
-      <el-table-column type="index" label="序号" align="center" width="50" />
+      <el-table-column type="index" label="序号" align="center" width="90">
+        <template slot="header">
+          <el-popover
+            ref="tablePopover"
+            v-model="popoverVisible"
+            width="240"
+            trigger="manual"
+          >
+            <span slot="reference" style="cursor: pointer;" @click="openPopover">
+              操作
+              <i class="el-icon-finished" style="font-weight: bold;" />
+            </span>
+            <div class="popoverCheckBoxArea">
+              <el-checkbox :indeterminate="isIndeterminate" @change="handleCheckAllChange">全选</el-checkbox>
+              <div style="margin: 10px 0;" />
+              <el-tree
+                ref="treeRef"
+                :data="optionsColumns"
+                :props="defaultProps"
+                :default-expand-all="true"
+                :default-checked-keys="checkedColumns"
+                show-checkbox
+                node-key="id"
+                class="treeColumnStyle"
+                @check-change="handleCheckChange"
+              />
+            </div>
+            <div class="popoverCheckBoxButton">
+              <el-button size="mini" @click="canclePopover">取消</el-button>
+              <el-button type="primary" size="mini" @click="confirmPopover">确定</el-button>
+            </div>
+          </el-popover>
+        </template>
+      </el-table-column>
       <el-table-column prop="enterpriseName" label="企业名称" align="center" show-overflow-tooltip width="120" />
       <el-table-column prop="groupUnit" label="集团单位" show-overflow-tooltip align="center" width="120" />
       <el-table-column prop="shareSuperdepart" label="股份主管部门" align="center" width="120" />
@@ -104,41 +137,6 @@
         <el-table-column prop="motorVehiclesWork" label="企业内机动车辆作业" align="center" width="130" />
         <el-table-column prop="otherSpecialWork" label="其他特种作业" align="center" width="120" />
       </el-table-column>
-
-      <el-table-column align="center" label="操作" min-width="100" fixed="right">
-        <template slot="header">
-          <el-popover
-            ref="tablePopover"
-            v-model="popoverVisible"
-            width="240"
-            trigger="manual"
-          >
-            <span slot="reference" style="cursor: pointer;" @click="openPopover">
-              操作
-              <i class="el-icon-arrow-down" style="font-weight: bold;" />
-            </span>
-            <div class="popoverCheckBoxArea">
-              <el-checkbox :indeterminate="isIndeterminate" @change="handleCheckAllChange">全选</el-checkbox>
-              <div style="margin: 10px 0;" />
-              <el-tree
-                ref="treeRef"
-                :data="optionsColumns"
-                :props="defaultProps"
-                :default-expand-all="true"
-                :default-checked-keys="checkedColumns"
-                show-checkbox
-                node-key="id"
-                class="treeColumnStyle"
-                @check-change="handleCheckChange"
-              />
-            </div>
-            <div class="popoverCheckBoxButton">
-              <el-button size="mini" @click="canclePopover">取消</el-button>
-              <el-button type="primary" size="mini" @click="confirmPopover">确定</el-button>
-            </div>
-          </el-popover>
-        </template>
-      </el-table-column>
     </el-table>
 
     <div class="page-btn-group">
@@ -550,15 +548,25 @@ export default {
     // 点击操作打开菜单选择框
     openPopover() {
       this.popoverVisible = true
+      this.$nextTick(() => {
+        document.getElementsByClassName('el-popover el-popper')[0].style.display = 'none'
+      })
     },
     // 处理多选框全部选中
     handleCheckAllChange(val) {
-      const treeRef = this.$refs.treeRef
-      if (val) {
-        treeRef.setCheckedNodes(this.getIds(this.optionsColumns))
-      } else {
-        treeRef.setCheckedNodes([])
-      }
+      const columnsValueList = []
+      this.getIds(this.optionsColumns).map(item => {
+        columnsValueList.push(item)
+      })
+      this.checkedColumns = val ? columnsValueList : []
+
+      console.log('this.checkedColumns :>> ', this.checkedColumns)
+      // const treeRef = this.$refs.treeRef
+      // if (val) {
+      //   treeRef.setCheckedNodes(this.getIds(this.optionsColumns))
+      // } else {
+      //   treeRef.setCheckedNodes([])
+      // }
     },
     canclePopover() {
       this.popoverVisible = false