<template>
  <a-collapse :defaultActiveKey="'1'" @change="collapseChange">
    <a-collapse-panel :header="$t('plan.team-members')" key="1">
      <a-card class='card card-bottom' id="grid-card">
				<template slot="title">
						<!-- 添加按钮-->
						<a-button v-show='isOwner' type='primary' @click='addTeamMembers()'>
              {{ $t('plan.team-members.add') }}
						</a-button>
						<!-- 批量删除 -->
						<a-button v-show='isOwner' class="ml-2" type='primary' @click='deleteAllTeamMember()'>
							{{ $t('plan.team-members.delete') }}
						</a-button>
				</template>
				<!-- 表格列设置-->
				<template slot="extra">
					<a-dropdown>
						<a-menu slot="overlay">
							<draggable v-model="sortedColumns" handle=".drag-handle" filter=".cant-handle" :move="onMove"
												 class="m-2 mr-1" tag="div" animation="500">
								<a-menu-item v-for="column in sortedColumns" :key="column.dataIndex" :disabled='true'
														 class="custom-menu-item mb-1" :class="column.cantHandle ? 'cant-handle' : ''">
									<div class="drag-handle" @mousedown="startDrag = true" @mouseup="startDrag = false"
											 @mouseleave="startDrag = false">
										<i class="icon iconfont iconshangxiayidong-"></i>
									</div>
									<a-checkbox v-model="editColumnVisibilities[column.dataIndex]" :disabled="column.cantHide"
															@change="handleCheckboxChange(column.dataIndex, $event.target.checked)">
										{{ column.title }}
									</a-checkbox>
								</a-menu-item>
							</draggable>
							<a-menu-item class="dropdown-footer" :disabled='true'>
								<a-button size="small" class="mr-2" @click='handleCheckBoxReset'>{{
										$t('global-btn.reset')
									}}
								</a-button>
								<a-button type="primary" size="small" @click="handleSaveTableConfig">{{
										$t('plan.change-record.save')
									}}
								</a-button>
							</a-menu-item>
						</a-menu>
						<a-button icon="setting" type="link" :title="($t('fmeamanager.setting.col'))"></a-button>
					</a-dropdown>
				</template>
        <!-- 表格 -->
        <a-table
					  id="team-member-table"
						ref='tableRef'
            class='mt-2'
            :loading='tableLoading'
            :rowKey='
							(record, index) => {
								return record.userId;
							}
						'
            :scroll='{ x: scrollWidth, y: tableHeightValue }'
						:columns='sortedColumns.filter(column => column.visible)'
						:components='components'
            :dataSource='teamTableData'
            :rowSelection="{
              selectedRowKeys: selectedTeamRowKeys,
              onChange: handleSelectChange
            }"
            :pagination='false'
            bordered
        >
          <!-- 团队 -->
          <template slot='teamType' slot-scope="text, record">
            <a-col>
              <a-select
                  :value='defaultTeamTypeComputed(record.teamType)'
                  :disabled='!isOwner'
                  :placeholder="$t('fmea.please-select-team')"
                  @change="handleTeamTypeChange(record, $event)">
                <!-- 核心团队 -->
                <a-select-option :value="1">{{ $t('plan.team-members.core-team') }}</a-select-option>
                <!-- 扩展团队 -->
                <a-select-option :value="2">{{ $t('plan.team-members.extended-team') }}</a-select-option>
              </a-select>
            </a-col>
          </template>
          <!--序列号-->
          <template slot="index" slot-scope="text, record, index">
            <span>{{ (pagination.current - 1) * pagination.pageSize + index + 1 }}</span>
          </template>
          <!--权限-->
          <template slot="permission" slot-scope="text, record">
            <a-col>
              <a-select
                :value="defaultPurviewComputed(record.purview)"
                :disabled='!isOwner'
                :placeholder="$t('fmea.please-select-permission')"
                @change="handlePurviewChange(record, $event)">
                <a-select-option :value="1">{{ $t('plan.team-members.edit') }}</a-select-option>
                <a-select-option :value="2">{{ $t('plan.team-members.view') }}</a-select-option>
              </a-select>
            </a-col>
          </template>
          <!-- 操作列 -->
          <template slot='operation' slot-scope='name, row'>
            <a v-show='isOwner' class='operation-text' href='javascript: void(0);'
               @click='deleteTeamMember(row)'>
              <!-- 删除 -->
              <a-tooltip :title="$t('plan.team-members.delete')">
                <i class='iconfont iconshanchu'></i>
              </a-tooltip>
            </a>
          </template>
        </a-table>
        <!-- MFMEA-团队成员添加弹窗 start -->
        <TeamMemberSelector
          ref='teamMember'
          :showAddModal='showAddModal'
          :projectTableData='projectMemberData'
          :teamTableData='teamTableData'
          :fmeaId="fmeaId"
          :isDFlag="true"
          @cancel='memberCancel'
          @handleAddSubmit='handleAddSubmit' />
        <!-- MFMEA-团队成员添加弹窗 end -->
      </a-card>
    </a-collapse-panel>
  </a-collapse>
</template>

<script>

import TeamMemberSelector from "./components/TeamMemberSelector/projectIndex";
import VueDraggableResizable from 'vue-draggable-resizable';
import draggable from 'vuedraggable';
export default {
  props: {
    isOwner: {
      type: Boolean,
      dafault: false
    }
  },
  components: {
    TeamMemberSelector,
		VueDraggableResizable,
		draggable
  },
  data() {
		this.components = {
			header: {
				cell: (h, props, children) => {
					const { key, ...restProps } = props;
					// 此处的this.sortedColumns 是定义的table的表头属性变量
					const col = this.sortedColumns.find((col) => {
						const k = col.dataIndex || col.key;
						return k === key;
					});
					if (!col || !col.width) {
						return h('th', {...restProps}, [...children]);
					}
					const dragProps = {
						key: col.dataIndex || col.key,
						class: 'table-draggable-handle',
						attrs: {
							w: 10,
							x: col.width,
							z: 1,
							axis: 'x',
							draggable: true,
							resizable: false
						},
						on: {
							dragging: (x, y) => {
								col.width = Math.max(x, 100);
							}
						}
					};
					const drag = h('vue-draggable-resizable', { ...dragProps });
					return h('th', { ...restProps, class: 'resize-table-th' }, [...children, drag]);
				}
			}
		};
    return {
      fmeaId: parseInt(this.$store.getters.fmeaId),
      // 核心团队角色字典
      coreTeamRoleList: [],
      showAddModal: false,// MFMEA 团队成员添加弹窗--默认隐藏
      projectMemberData: [],
      defaultTeamType: '1', // 默认团队
      defaultPurview: '1', // 默认权限
      // 分页
      pagination: {
        // defaultPageSize: 10,
        current: 1,
        pageNo: 1,
        pageSize: 6, // 默认每页显示数量
        showTotal: total => this.$t('workbench.a-total-of-data', { total: `${total}` }), // 显示总数
        showSizeChanger: true, // 显示可改变每页数量
        pageSizeOptions: ['10', '20', '50', '100', '200'], // 每页数量选项
        onShowSizeChange: (current, pageSize) => (this.pageSize = pageSize), // 改变每页数量时更新显示
        // onChange: (page, pageSize) => self.changePage(page, pageSize), //点击页码事件
        total: 0, //总条数
        showQuickJumper: true
      },
			// 表格操作列配置
			sortedColumns: [],
			startDrag: false,
			editColumnVisibilities: [],
			scrollWidth: 0,
			tableHeightValue: 0,
			// 复选框控制的状态
			columnVisibilities: {
				index: true,
				teamType: true,
				userName: true,
				roleName: true,
				permission: true,
				mobile: true,
				email: true,
				operation: true,
			},
      // 团队成员-表头
      tableColumns: [
        {
          title: 'plan.team-members.serial-number',
          align: 'center',
					dataIndex: 'index',
          scopedSlots: {
            customRender: 'index'
          },
          fixed: 'left',
          width: 150,
					visible: true,
					cantHide: true,
					cantHandle: true,
          ellipsis: true
        },
        {
          title: 'plan.team-members.team',
          align: 'center',
          dataIndex: 'teamType',
          scopedSlots: {
            customRender: 'teamType'
          },
          width: 150,
					visible: true
          // ellipsis: true,
        },
        {
          title: 'plan.team-members.name',
          align: 'center',
          dataIndex: 'userName',
          scopedSlots: {
            customRender: 'userName'
          },
          width: 150,
					visible: true
          // ellipsis: true,
        },
        {
          title: 'plan.team-members.role',
          align: 'center',
          dataIndex: 'roleName',
          width: 500,
					visible: true,
          ellipsis: true,
        },
        // 权限
        {
          title: 'plan.team-members.permission',
          align: 'center',
          dataIndex: 'permission',
          scopedSlots: {
            customRender: 'permission'
          },
          width: 200,
					visible: true,
          ellipsis: true
        },
        {
          title: 'plan.team-members.mobile',
          align: 'center',
          dataIndex: 'mobile',
          width: 200,
					visible: true,
          ellipsis: true
        },
        {
          title: 'plan.team-members.email',
          align: 'center',
          dataIndex: 'email',
          width: 200,
					visible: true,
          ellipsis: true
        },
        {
          title: 'research.operate',
          dataIndex: 'operation',
          key: 'operation',
          align: 'center',
          scopedSlots: {
            customRender: 'operation'
          },
          width: 100,
					visible: true,
					cantHide: true,
					cantHandle: true,
          // ellipsis: true,
          fixed: 'right'
        }
      ],
      // 团队成员-数据
      teamTableData: [],
      tableLoading: false,
      selectedTeamRowKeys: [], // 成员选中的行的索引列表
    }
  },
	watch: {
		sortedColumns: {
			handler() {
				this.$nextTick(() => {
					// 获取表格滚动区域的总宽度
					let scrollX = $('.ant-table-fixed').width();
					// 获取表格的总宽度
					let tableWidth = $('.ant-table-body').width();
					// a-table的scrollX宽度需要减去固定列宽度
					this.scrollWidth = scrollX - 250;
					if (scrollX <= tableWidth) {
						this.cancelFixedColmuns();
					} else {
						this.reloadFixedColmuns([0], [this.sortedColumns.length - 1]);
					}
				});
			},
			deep: true,
			immediate: true
		}
	},
  methods: {
		/**
		 * 初始化加载已保存的表格列顺序及显隐
		 */
		async initTableColumns() {
			// 获取用户信息，如果当前组件的userInfo为空，则从localStorage中获取
			let userInfo = this.userInfo || JSON.parse(localStorage.getItem('userInfo'));
			try {
				// 调用接口获取表格列数据
				let res = await this.$api.getTableColumnsData({
					userId: userInfo.userId,
					pagePath: this.$route.path,
					pageName: this.$route.name,
				});
				// 如果接口返回成功
				if (res.flag) {
					// 如果返回的数据中包含当前表格的配置映射，并且映射中有数据
					if (res.data.currentTableConfigMap && Object.keys(res.data.currentTableConfigMap).length > 0) {
						// 获取当前表格的配置信息
						let tableConfig = res.data.currentTableConfigMap['team-member-table'];
						// 如果表格配置存在
						if (tableConfig) {
							// 解析表格列数据 将从数据库中获取的表格title通过$t方法翻译后存储到新的数组中 再将其赋值给sortedColumns
							let oldColumns = JSON.parse(tableConfig.tableColumns);
							oldColumns.forEach((column) => {
								// 处理表格列的title
								column.title = this.$t(column.title);
							});
							this.sortedColumns = [...oldColumns];
							// 解析表格列显示状态
							this.editColumnVisibilities = JSON.parse(tableConfig.tableVisibilities);
						} else {
							// 如果没有表格配置，则使用默认的表格列和显示状态
							// 处理表格列的title 将默认表格配置数据中的title通过$t方法翻译后存储到新的数组中 再将其赋值给sortedColumns 避免污染tableColumns默认数据
							let newTableColumns = [];
							this.tableColumns.forEach((column) => {
								let newColumn = { ...column };
								newColumn.title = this.$t(column.title);
								newTableColumns.push(newColumn);
							});
							this.sortedColumns = [...newTableColumns];
							this.editColumnVisibilities = { ...this.columnVisibilities };
						}
					} else {
						// 如果没有表格配置，则使用默认的表格列和显示状态
						// 处理表格列的title 将默认表格配置数据中的title通过$t方法翻译后存储到新的数组中 再将其赋值给sortedColumns 避免污染tableColumns默认数据
						let newTableColumns = [];
						this.tableColumns.forEach((column) => {
							let newColumn = { ...column };
							newColumn.title = this.$t(column.title);
							newTableColumns.push(newColumn);
						});
						this.sortedColumns = [...newTableColumns];
						this.editColumnVisibilities = { ...this.columnVisibilities };
					}
					// 如果接口返回失败
				} else {
					console.error('Failed to retrieve table column data.');
				}
			} catch (error) {
				// 捕获异常，并输出错误信息
				console.error('Error occurred while fetching table columns:', error);
			}
		},
		/**
		 * 处理窗口大小调整事件
		 *
		 * @returns 无返回值
		 */
		handleResize() {
			// 获取窗口宽度
			const width = window.innerWidth;
			// 获取窗口高度
			const height = Math.max(window.innerHeight, 0);
			// 系统内菜单栏、标签栏的高度恒定为64 + 40 = 104，其他页边距需根据每个页面布局自行计算
			$("#grid-card").height(height - 144);
			this.tableHeightValue = height - 126;
			this.scrollWidth = this.$refs.tableRef?.$el.offsetWidth;
			// 获取表格滚动区域的总宽度
			let scrollX = $('.ant-table-fixed').width() - 250;
			// 获取表格的总宽度
			let tableWidth = $('.ant-table-body').width();
			// 超过2K屏时取消固定列
			if (width > 2560 || scrollX <= tableWidth) {
				this.cancelFixedColmuns();
			} else {
				this.reloadFixedColmuns([0], [this.sortedColumns.length - 1]);
			}
		},
		/**
		 * 移动事件处理函数
		 *
		 * @param event 事件对象
		 * @returns 如果当前元素不包含禁止移动属性则返回true，否则返回false
		 */
		onMove(event) {
			// 禁止移动到包含禁止移动元素的行
			return !event.relatedContext.element.cantHandle;
		},
		/**
		 * 处理表格列显隐复选框变化事件
		 *
		 * @param key 列的唯一标识符
		 * @param checked 列的显示状态，true表示显示，false表示隐藏
		 */
		handleCheckboxChange(key, checked) {
			// 更新全局的columnVisibilities对象
			this.$set(this.editColumnVisibilities, key, checked);
			// 更新列配置中的visible属性（如果需要的话）
			this.sortedColumns.forEach(column => {
				if (column.dataIndex === key) {
					column.visible = checked;
				}
			});
		},
		/**
		 * 重置表格列显示隐藏
		 */
		handleCheckBoxReset() {
			this.editColumnVisibilities = { ...this.columnVisibilities };
			// 重置时，将默认表格配置数据中的title通过$t方法翻译后存储到新的数组中 再将其赋值给sortedColumns 避免污染tableColumns默认数据
			let resetColumns = [];
			this.tableColumns.forEach(column => {
				let newColumn = { ...column };
				newColumn.title = this.$t(column.title);
				resetColumns.push(newColumn);
			});
			this.sortedColumns = [...resetColumns];
			this.sortedColumns.forEach(column => {
				this.$set(column, 'visible', true);
			});
		},
		/**
		 * 保存表格配置信息
		 */
		handleSaveTableConfig() {
			// 创建一个对象用于保存需要保存的配置数据
			// 将sortedColumns中的title替换为tableColumns中的title
			let newSortedColumns = [];
			this.sortedColumns.forEach(column => {
				let newColumn = { ...column };
				if (this.tableColumns.find(item => item.dataIndex === column.dataIndex)) {
					let item = this.tableColumns.find(item => item.dataIndex === column.dataIndex);
					newColumn.title = item.title;
				}
				newSortedColumns.push(newColumn);
			});
			let data = {
				pagePath: this.$route.path,
				pageName: this.$route.name,
				// 表格列信息，转为JSON字符串
				tableColumns: JSON.stringify(newSortedColumns),
				// 表格列可见性信息，转为JSON字符串
				tableVisibilities: JSON.stringify(this.editColumnVisibilities),
				// 表格id
				tableId: 'team-member-table'
			};
			// 调用API保存表格配置
			this.$api.saveTableConfig(data).then(res => {
				// 如果返回结果中的flag为true，表示保存成功
				if (res.flag) {
					// 显示成功提示信息
					this.$message.success(res.message, 1);
					// 重新初始化数据
					this.getTeamMemberList();
				} else {
					// 显示错误提示信息
					this.$message.error(res.message, 1);
				}
			}).finally(() => {
				// 重新初始化数据
				this.getTeamMemberList();
			});
		},
		/**
		 * 取消固定列
		 *
		 * @returns 无返回值
		 */
		cancelFixedColmuns() {
			// 遍历已排序的列
			this.sortedColumns.forEach((column) => {
				// 如果列的固定属性为true
				if (column.fixed) {
					// 将列的固定属性设置为false
					column.fixed = false;
				}
			});
		},
		/**
		 * 重新设置固定列的固定状态
		 *
		 * @param fixedLeftColumns 左侧固定列名数组
		 * @param fixedRightColumns 右侧固定列名数组
		 */
		reloadFixedColmuns(fixedLeftColumns, fixedRightColumns) {
			fixedLeftColumns.forEach((column) => {
				if (this.sortedColumns[column]) {
					this.sortedColumns[column].fixed = 'left';
				}
			});
			fixedRightColumns.forEach((column) => {
				if (this.sortedColumns[column]) {
					this.sortedColumns[column].fixed = 'right';
				}
			});
		},
    /**
     * 获取团队成员列表
     */
    getTeamMemberList() {
      let _that = this;
      let extendTeamList = [];
      let data = {
        fmeaId: this.fmeaId
      }
      _that.tableLoading = true;
      _that.$api.getBindTeamMemberList(data).then(res =>{
        if (res.flag) {
          if (res.data.mfmeaTeamMemberModelList) {
            this.groupIndex = res.data.mfmeaTeamMemberModelList.length || 0;
            res.data.mfmeaTeamMemberModelList.forEach((item, index) => {
              item.index = index;
              item.type = item.type ? item.type : 'edit';
              item.userDepartmentId = item.userId && item.departmentId ?
                  item.userId + '/' + item.departmentId :
                  '';
              item.roleName = item.role;
              // 团队成员
              extendTeamList.push(item);
            });
            this.$nextTick(() => {
              this.teamTableData = extendTeamList;
            });
          }
        }
      }).finally(() => {
        _that.tableLoading = false;
      })
    },
    /**
     * 团队成员添加 保存后刷新列表数据
     */
    handleAddSubmit() {
      this.showAddModal = false;
      this.getTeamMemberList();
    },
    /**
     * 团队成员弹窗关闭
     */
    memberCancel() {
      this.showAddModal = false;
    },
    /**
     * 折叠展开事件
     * @param keys
     * @returns {boolean}
     */
    collapseChange(keys) {
      if (!(keys && keys.length > 0)) {
        return false;
      }
    },
    /**
     * 添加团队成员
     */
    addTeamMembers() {
      this.showAddModal = true;
      this.allUser = true;
      this.ownerType = '';
      this.partmentFlag = true;
    },
    /**
     * 成员复选框操作
     * @param selectedTeamRowKeys
     */
    handleSelectChange(selectedTeamRowKeys) {
      // 更新选中行的key
      this.selectedTeamRowKeys = selectedTeamRowKeys;
    },
    /**
     * 默认团队
     * @param teamType
     * @returns {*}
     */
    defaultTeamTypeComputed(teamType) {
      return teamType || this.defaultTeamType; // 如果teamType存在，则返回teamType的值，否则返回默认值
    },
    /**
     * 当团队改变时 使用$set方法来更新响应式属性
     * @param record
     * @param value
     */
    handleTeamTypeChange(record, value) {
      this.$set(record, 'teamType', value);
      let modifyTeamMemberList = [];
      let user = {
        personId: record.id,
        departmentId: record.departmentId,
        userId: record.userId,
        orgId: record.orgId,
        userName: record.userName,
        type: 'add',
        departmentName: record.departmentName,
        userDepartmentId: record.userId + '/' + record.departmentId,
        mobile: record.mobile,
        email: record.email,
        teamType: record.teamType,
        purview: record.purview
      }
      modifyTeamMemberList.push(user);
      let data = {
        fmeaId: this.fmeaId,
        rfmeaId: this.$store.getters.rfmeaId,
        addTeamMemberList: [],
        modifyTeamMemberList: modifyTeamMemberList
      }
      this.$api.editTeamMember(data).then(res => {
        if (!res.flag) {
          this.$notification.error({ message: res.message });
        } else {
          this.$notification.success({ message: res.message });
          this.getTeamMemberList();
        }
      });
    },
    /**
     * 默认权限
     * @param purview
     * @returns {string}
     */
    defaultPurviewComputed(purview) {
      return purview || this.defaultPurview; // 如果purview存在，则返回purview的值，否则返回默认值
    },
    /**
     * 当权限改变时 使用$set方法来更新响应式属性
     * @param record
     * @param value
     */
    handlePurviewChange(record, value) {
      this.$set(record, 'purview', value);
      let modifyTeamMemberList = [];
      let user = {
        personId: record.id,
        departmentId: record.departmentId,
        userId: record.userId,
        orgId: record.orgId,
        userName: record.userName,
        type: 'add',
        departmentName: record.departmentName,
        userDepartmentId: record.userId + '/' + record.departmentId,
        mobile: record.mobile,
        email: record.email,
        teamType: record.teamType,
        purview: record.purview
      }
      modifyTeamMemberList.push(user);
      let data = {
        fmeaId: this.fmeaId,
        rfmeaId: this.$store.getters.rfmeaId,
        addTeamMemberList: [],
        modifyTeamMemberList: modifyTeamMemberList
      }
      this.$api.editTeamMember(data).then(res => {
        if (!res.flag) {
          this.$notification.error({ message: res.message });
        } else {
          this.$notification.success({ message: res.message });
          this.getTeamMemberList();
        }
      });
    },
    /**
     * 删除团队成员
     * @param row
     */
    deleteTeamMember(row) {
      // 查找需要删除的行在表格数据中的索引
      let delIndex = this.teamTableData.findIndex((value, index, arr) => {
        // 返回值为true时，findIndex会返回当前元素的索引
        return value.userId === row.userId;
      });

      // 如果找到了要删除的行
      if (~delIndex) {
        let _this = this;
        // 弹出确认框
        this.$confirm({
          title: this.$t('fmeamanager.snakerflow.design.isDeleted'), // 确认框标题
          okText: this.$t('fmea.yes'), // 确认按钮文字
          okType: 'danger', // 确认按钮类型
          cancelText: this.$t('fmea.no'), // 取消按钮文字
          onOk() {
            // 如果存在userId，则执行删除操作
            if (row.userId) {
              let userIds = [];
              userIds.push(row.userId);
              // 准备要传递给接口的数据
              let data = {
                fmeaId: _this.fmeaId,
                userIds: userIds
              };
              // 调用接口进行删除操作
              _this.$api.delTeamMember(data).then(res => {
                // 如果删除成功
                if (res.flag) {
                  // 弹出成功提示
                  _this.$notification.success({ message: res.message });
                  // 从表格数据中移除已删除的行
                  _this.teamTableData.splice(delIndex, 1);
                } else {
                  // 如果删除失败，则弹出错误提示
                  this.$notification.error({ message: res.message });
                }
              });
            } else {
              // 如果不存在userId，则直接从表格数据中移除该行
              _this.teamTableData.splice(delIndex, 1);
            }
          },
          onCancel() {
            // 取消删除操作
          }
        });
      }
    },
    /**
     * 批量删除团队成员
     */
    deleteAllTeamMember() {
      // 获取选中的行的keys
      let selectedKeys = this.selectedTeamRowKeys;
      let _this = this;
      this.$confirm({
        title: this.$t('fmeamanager.snakerflow.design.isDeleted'),
        okText: this.$t('fmea.yes'),
        okType: 'danger',
        cancelText: this.$t('fmea.no'),
        onOk() {
          // 调用删除接口
          _this.$api.delTeamMember({ fmeaId: _this.fmeaId, userIds: selectedKeys }).then(res => {
            if (res.flag) {
              _this.$notification.success({ message: res.message });
              _this.getTeamMemberList();
            } else {
              _this.$notification.error({ message: res.message });
            }
          }).finally(() => {
            // 清空选中的行
            _this.selectedTeamRowKeys = [];
          });
        }
      });
    }
  },
  computed: {
  },
  mounted() {
    this.getTeamMemberList();
		// 获取表格配置
		this.initTableColumns();
		this.handleResize();
		// 监听页面窗体大小变化
		window.addEventListener('resize', this.handleResize);
  },
	//剔除页面窗体大小变化得监听事件
	beforeDestroy() {
		window.removeEventListener('resize', this.handleResize);
	}
};
</script>
<style lang="less" scoped>
.operation-text {
  color: #1890ff;
}

/deep/ .ant-table-fixed-header .ant-table-scroll .ant-table-header {
  overflow: hidden!important;
  margin-bottom: 0!important;
  padding-right: 8px;
  background: rgb(250, 250, 250);
}
</style>
