<template>
  <DragModal
      :visible="dialogFormVisible"
      :width="widthValue"
      :destroyOnClose="true"
      :maskClosable="false"
      @cancel="closeModal"
      :dialog-style="topValue"
      :body-style="bodyStyle">
    <template slot="title">
      <span>{{ $t('functional-analysis.association-history-failure') }}</span>
      <!-- 全屏 -->
      <a-icon v-if="!fullScreenFlag" type="fullscreen" class="fullScreen" @click="changeFullScreen" />
      <!-- 取消全屏 -->
      <a-icon v-if="fullScreenFlag" type="fullscreen-exit" class="fullScreen" @click="changeFullScreen" />
    </template>
    <div>
      <a-card id="search-card">
        <a-form layout="vertical">
          <a-row :gutter="24">
            <a-col :xl="6" :lg="8" :md="12" :sm="24" :xs="24">
              <a-form-item :label="$t('functional-analysis.association-history-failure.problem-number')">
                <a-input allow-clear v-model="searchParams.issueCode"
                         :placeholder="$t('functional-analysis.association-history-failure.please-enter-problem-number')"/>
              </a-form-item>
            </a-col>
            <a-col :xl="6" :lg="8" :md="12" :sm="24" :xs="24">
              <a-form-item :label="$t('functional-analysis.association-history-failure.responsible')">
                <a-input allow-clear v-model="searchParams.responsible"
                         :placeholder="$t('functional-analysis.association-history-failure.please-enter-responsible')"/>
              </a-form-item>
            </a-col>
            <a-col :xl="6" :lg="8" :md="12" :sm="24" :xs="24">
                <a-form-item :label="$t('functional-analysis.association-history-failure.structure-code')">
                  <a-input allow-clear v-model="searchParams.svpps"
                           :placeholder="$t('functional-analysis.association-history-failure.please-enter-structure-code')"/>
                </a-form-item>
              </a-col>
            <a-col :xl="6" :lg="8" :md="12" :sm="24" :xs="24">
                <a-form-item :label="$t('functional-analysis.association-history-failure.project')">
                  <a-input allow-clear v-model="searchParams.project"
                           :placeholder="$t('functional-analysis.association-history-failure.please-enter-project')"/>
                </a-form-item>
              </a-col>
            <span v-show="advanceExpand">
              <a-col :xl="6" :lg="8" :md="12" :sm="24" :xs="24">
                <a-form-item :label="$t('functional-analysis.association-history-failure.close-time')">
                  <a-range-picker
                      class="width100"
                      :value="tg1Date"
                      allow-clear
                      @change="closeDateChange"/>
                </a-form-item>
              </a-col>
              <a-col :xl="6" :lg="8" :md="12" :sm="24" :xs="24">
                <a-form-item :label="$t('functional-analysis.association-history-failure.source')">
                       <a-input v-model="searchParams.issueSource"
                                :placeholder="$t('functional-analysis.association-history-failure.please-enter-source')"
                                allow-clear/>
                </a-form-item>
              </a-col>
              <a-col :xl="6" :lg="8" :md="12" :sm="24" :xs="24">
                <a-form-item :label="$t('functional-analysis.association-history-failure.type')">
                  <!-- <a-select
                      allow-clear
                      @change="typeChange"
                      v-model="searchParams.type"
                      :placeholder="$t('functional-analysis.association-history-failure.please-select-type')">
                    <a-select-option
                        v-for="(item, index) in typeDict"
                        :key="index"
                        :value="item.value">
                      {{ item.name }}
                    </a-select-option>
                  </a-select> -->
                  <a-input
                    allowClear
                    v-model="searchParams.type"
                    :placeholder="$t('research.please-enter-type')"
                  />
                </a-form-item>
              </a-col>
            </span>
            <a-col
                :xl="advanceExpand ? 6 : 24"
                :lg="16"
                :md="advanceExpand ? 12 : 24"
                :sm="24"
                :xs="24"
            >
              <a-form-item class="tr" :label="'\xa0'">
                <a @click="toggleAdvance">
                  {{
                    advanceExpand
                        ? $t("global.collapse")
                        : $t("global.expand")
                  }}
                  <a-icon :type="advanceExpand ? 'up' : 'down'" />
                </a>
                <a-button class='ml10' @click='reset'>{{ $t('global-btn.reset') }}</a-button>
                <a-button class="ml10" @click="search" type="primary">
                  {{ $t('global-btn.search') }}
                </a-button>
              </a-form-item>
            </a-col>
          </a-row>
        </a-form>
      </a-card>
      <a-card id="grid-card">
        <!-- 表格列显隐，拖拽 -->
        <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('global-constant.setting.col'))"></a-button>
          </a-dropdown>
        </template>
        <a-table
            id="function-analysis-modal-table"
            ref='tableRef'
            :components='components'
            :data-source="tableData"
            :columns="sortedColumns.filter(column => column.visible)"
            :customRow="customRow"
            :rowKey="(row, index) => {return index;}"
            :row-selection="{
                fixed: true,
                selectedRowKeys: selectedRowKeys,
                onChange: onSelectChange
              }"
            bordered
            size="small"
            :loading="tableLoading"
            :scroll="{ x: scrollWidth, y: tableHeightValue }"
            @change="tableChange"
            :pagination="pagination">
          <template slot="issueNo" slot-scope="text, row">
            <span
              :title="row.issueNo"
              @click="toDetail(row, 0)"
              class="system-font-color"
            >
              {{ row.issueNo }}
            </span>
          </template>
        </a-table>
      </a-card>
      <div slot="footer" class="dialog-footer mt10 text-right">
        <a-button
            type="primary"
            :loading="saveLoading"
            @click="save()"
            v-preventReClick>
          {{ $t('global-btn.save') }}
        </a-button>
      </div>
    </div>
  </DragModal>
</template>

<script>

import DragModal from "@/components/DragModal";
import VueDraggableResizable from 'vue-draggable-resizable';
import draggable from 'vuedraggable';
export default {
  name: "HistoryFaultModal",
  components: {
    DragModal,
    VueDraggableResizable,
    draggable
  },
  props: {
    showHistoryFaultModal: {
      type: Boolean,
      default: false
    }
  },
  watch: {
    showHistoryFaultModal(val) {
      this.dialogFormVisible = val;
    },
    sortedColumns: {
      handler() {
        this.$nextTick(() => {
          // 获取表格滚动区域的总宽度
          let scrollX = $('.ant-table-fixed').width();
          // 获取表格的总宽度
          let tableWidth = $('.ant-table-body').width();
          // a-table的scrollX宽度需要减去固定列宽度
          this.scrollWidth = scrollX - 260;
          if (scrollX <= tableWidth) {
            this.cancelFixedColmuns();
          // } else {
          //   this.reloadFixedColmuns([0], [this.sortedColumns.length - 1]);
          }
        });
      },
      deep: true,
      immediate: true
    },
    advanceExpand: {
      handler() {
        this.$nextTick(() => {
          this.handleResize();
        });
      }
    },
  },
  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 {
      // 表格总宽度
      scrollWidth: undefined,
      /** 表格高度 */
      tableHeight: '',
      tableHeightValue: '',
      startDrag: false,
      sortedColumns: [], // 用于拖拽的列数组
      editColumnVisibilities: [],
      /**全屏标识 */
      fullScreenFlag: false,
      /**弹窗宽度 */
      widthValue: 1000,
      /**弹窗高度位置 */
      topValue: {},
      /**弹窗样式 */
      bodyStyle: {},
      /** 模态框状态 */
      dialogFormVisible: false,
      /** 种类字典Dict */
      typeDict: [],
      /** 表格数据 */
      tableData: [],
      /** 展开/收起 */
      advanceExpand: false,
      /** 表格列头 */
      tableColumns: [
        {
          title: this.$t('functional-analysis.association-history-failure.problem-number'),
          width: 200,
          dataIndex: "issueNo",
          align: "center",
          scopedSlots: {
            customRender: "issueNo"
          },
          visible: true,
          ellipsis: true
        },
        {
          title: this.$t('functional-analysis.association-history-failure.source'),
          width: 150,
          dataIndex: "issueSource",
          align: "center",
          scopedSlots: {customRender: "source"},
          visible: true,
          ellipsis: true
        },
        {
          title: this.$t('functional-analysis.association-history-failure.type'),
          width: 150,
          dataIndex: "failureType",
          align: "center",
          visible: true,
          ellipsis: true
        },
        {
          title: this.$t('functional-analysis.association-history-failure.project'),
          width: 100,
          align: "center",
          dataIndex: "projectName",
          visible: true,
          ellipsis: true
        },
        {
          title: this.$t('functional-analysis.association-history-failure.responsible'),
          width: 100,
          align: "center",
          dataIndex: "responsible",
          visible: true,
          ellipsis: true
        },
        {
          title: this.$t('functional-analysis.association-history-failure.close-time'),
          width: 100,
          dataIndex: "closeDate",
          align: "center",
          visible: true,
          ellipsis: true
        },
        {
          title: this.$t('functional-analysis.association-history-failure.structure-code'),
          width: 100,
          align: "center",
          dataIndex: "svpps",
          visible: true,
          ellipsis: true
        }
      ],
      // 复选框控制的状态
      columnVisibilities: {
        issueNo: true,
        issueSource: true,
        failureType: true,
        projectName: true,
        responsible: true,
        closeDate: true,
        svpps: true
      },
      /** 表格分页 */
      pagination: {
        current: 1, // 当前页数
        pageSize: 10, // 每页条数
        showTotal: total => this.$t('global-constant.table.show-total', [total]), //用于显示数据总量和当前数据顺序
        showSizeChanger: true, // 是否可以改变 pageSize
        pageSizeOptions: ['10', '20', '50', '100', '200'], // 指定每页可以显示多少条
        onShowSizeChange: (current, pageSize) => (this.pageSize = pageSize), // pageSize 变化的回调
        total: 0 // 总条数
      },
      /** 指定选中项的：key数组 */
      selectedRowKeys: [],
      /** 指定选中项的：数组数据 */
      selectedRows: [],
      /** 表格Loading */
      tableLoading: false,
      /** 保存Loading */
      saveLoading: false,
      /** 检索条件 */
      searchParams: {
        /** 是否适用 */
        isApply: 1,
        /** FMEA标识 */
        fmeaId: this.$store.getters.fmeaId,
        /** 问题标号 */
        issueCode: undefined,
        /** 标题 */
        title: undefined,
        /** 责任人 */
        responsible: undefined,
        /** 状态 */
        state: undefined,
        /** SVPPS */
        svpps: undefined,
        /** 项目 */
        project: undefined,
        /** 关闭日期 */
        pqcpCloseStartDate: undefined,
        pqcpCloseEndDate: undefined,
        /** 来源 */
        source: undefined,
        /** 种类 */
        type: undefined,
        /** 分页 */
        pageNo: 1,
        pageSize: 10,
      },
      /** 默认表格打勾数据 */
      defaultTableCheckedData: [],
      /** 添加打勾数据 */
      addCheckedData: [],
      /** 删除打勾数据 */
      delCheckedData: [],
      /** 关闭时间显示数据 */
      tg1Date: []
    }
  },
  methods: {
    /**
     * 取消固定列
     *
     * @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';
        }
      });
    },
    /**
     * 初始化加载已保存的表格列顺序及显隐
     */
    async initTableColumns() {
      // 获取页面中所有的表格容器
      let tableWrappers = document.querySelectorAll('.ant-table-wrapper');
      // 提取表格容器的id，并转换为数组
      let tableIds = Array.from(tableWrappers).map(item => item.id);
      try {
        // 调用接口获取表格列数据
        let res = await this.$api.getTableColumnsData({
          userId: this.$route.query.userId,
          pagePath: this.$route.path,
          pageName: this.$route.name,
          tableIds: tableIds
        });
        // 如果接口返回成功
        if (res.flag) {
          // 如果返回的数据中包含当前表格的配置映射，并且映射中有数据
          if (res.data.currentTableConfigMap && Object.keys(res.data.currentTableConfigMap).length > 0) {
            // 获取当前表格的配置信息
            let tableConfig = res.data.currentTableConfigMap['function-analysis-modal-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);
      }
    },
    /**
     * 移动事件处理函数
     *
     * @param event 事件对象
     * @returns 如果当前元素不包含禁止移动属性则返回true，否则返回false
     */
    onMove(event) {
      // 禁止移动到包含禁止移动元素的行
      return !event.relatedContext.element.cantHandle;
    },
    /**
     * 保存表格配置信息
     */
    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: 'function-analysis-modal-table'
      };
      // 调用API保存表格配置
      this.$api.saveTableConfig(data).then(res => {
        // 如果返回结果中的flag为true，表示保存成功
        if (res.flag) {
          // 显示成功提示信息
          this.$message.success(res.message, 1);
          // 重新初始化数据
          this.list();
        } else {
          // 显示错误提示信息
          this.$message.error(res.message, 1);
        }
      }).finally(() => {
        // 重新初始化数据
        this.list();
      });
    },
    /**
     * 处理表格列显隐复选框变化事件
     *
     * @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);
      });
    },
    /**
     * 处理窗口大小调整事件
     *
     * @returns 无返回值
     */
     handleResize() {
      // 获取窗口宽度
      const width = window.innerWidth;
      // 获取窗口高度
      const height = Math.max(window.innerHeight, 0);
      // 获取用户信息容器的高度
      let searchCardHeight = $("#search-card").height();
      // 系统内菜单栏、标签栏的高度恒定为64 + 40 = 104，其他页边距需根据每个页面布局自行计算
      $("#grid-card").height(height - 104 - searchCardHeight - 40);
      this.tableHeightValue = height - 104 - searchCardHeight - 222;
      this.scrollWidth = this.$refs.tableRef?.$el.offsetWidth;
      // 获取表格滚动区域的总宽度
      let scrollX = $('.ant-table-fixed').width() - 260;
      // 获取表格的总宽度
      let tableWidth = $('.ant-table-body').width();
      // 超过2K屏时取消固定列
      if (width > 2560 || scrollX <= tableWidth) {
        this.cancelFixedColmuns();
      // } else {
      //   this.reloadFixedColmuns([0], [this.sortedColumns.length - 1]);
      }
    },
    // 收起/展开
    toggleAdvance() {
      this.advanceExpand = !this.advanceExpand;
    },
    /**
     * 关闭模态框
     */
    closeModal() {
      this.$emit("closeHistoryFaultModal");
    },
    /**
     * 刷新右侧树
     */
    initRightTree() {
      this.$emit("initRightTree");
    },
    /**
     * 取得字典数据：
     * 来源、种类
     */
    initDict() {
      let _that = this;
      _that.$api.getTypeDict().then((res) => {
        if (res.flag) _that.typeDict = res.data;
      });
    },
    /**
     * 取得表格勾选数据
     */
    getTableCheckData() {
      let _that = this;
      _that.$api.getExistResearchTree({
        fmeaId: _that.$store.getters.fmeaId,
        faultId: _that.$store.getters.lastCheckedNode.id,
      }).then((res) => {
        if (res.flag) {
          let checkedData = res.data;
          if (checkedData && checkedData.length > 0) {
            for (let i = 0, len = _that.tableData.length; i < len; i++) {
              if (checkedData.filter(item => item === _that.tableData[i].id)[0]) {
                _that.defaultTableCheckedData.push(_that.tableData[i].id);
                _that.selectedRowKeys.push(i);
                _that.selectedRows.push(_that.tableData[i]);
              }
            }
          }
        } else {
          _that.$message.error(res.message, 1);
        }
      }).catch((error) => {
        _that.$message.error(error.response.data.message, 1);
      });
    },
    /**
     * 搜索
     */
    search() {
      this.list();
    },
    /**
     * 列表
     */
    list() {
      let _that = this;
      _that.tableLoading = true;
      _that.$api.getResearch(
          _that.searchParams
      ).then(res => {
        if (res.flag) {
          _that.defaultTableCheckedData = [];
          _that.selectedRows = [];
          _that.selectedRowKeys = [];
          _that.tableData = res.data.data;
          _that.pagination.current = res.data.pageNo;
          _that.pagination.pageSize = res.data.pageSize;
          _that.pagination.total = res.data.total;
          _that.getTableCheckData();
        } else {
          _that.$message.error(res.message, 1);
        }
      }).catch((error) => {
        _that.$message.error(error.response.data.message, 1);
      }).finally(() => {
        _that.tableLoading = false;
      });
    },
    /**
     * 重置
     */
    reset() {
      this.searchParams.issueCode = undefined;
      this.searchParams.responsible = undefined;
      this.searchParams.svpps = undefined;
      this.searchParams.project = undefined;
      this.searchParams.source = undefined;
      this.searchParams.type = undefined;
      this.searchParams.pqcpCloseStartDate = undefined;
      this.searchParams.pqcpCloseEndDate = undefined;
      this.tg1Date = [];
      this.pageNo = 1;
      this.pageSize = 10;
      this.pagination.pageNo = 1;
      this.pagination.pageSize = 10;
      this.tableData = [];
      this.list();
    },
    /**
     * 校验保存数据
     */
    validateSaveData() {
      let _that = this;
      let flag = true;
      let checkData = new Set(_that.selectedRows.map(item => item.id));
      if (checkData.length === 0) {
        _that.$message.warning("表格数据未修改！", 1);
        return false;
      }
      // 默认表格打勾数据与表格复选框数据：交集
      let innerJoinData = new Set([..._that.defaultTableCheckedData].filter((x) => checkData.has(x)));
      // 删除数据：默认表格打勾数据与上述交集的交集
      _that.delCheckedData = new Set([..._that.defaultTableCheckedData].filter((x) => !innerJoinData.has(x)));
      // 添加数据：表格复选框数据与上述交集的交集
      _that.addCheckedData = new Set([...checkData].filter((x) => !innerJoinData.has(x)));
      if (_that.delCheckedData.size === 0 && _that.addCheckedData.size === 0) {
        _that.$message.warning(this.$t('global-message.warn.table-data-not-modified'), 1);
        return false;
      }
      return flag;
    },
    /**
     * 保存
     */
    save() {
      let _that = this;
      // 校验
      if (!_that.validateSaveData()) return;

      /************** 数据处理 Start *************/
      // 当前失效节点
      let lastCheckedNode = _that.$store.getters.lastCheckedNode;
      // 功能节点
      let functionNode = lastCheckedNode.functionParent;
      // 结构数据
      let structureNode = lastCheckedNode.structureParent;
      /************** 数据处理 End *************/

      _that.saveLoading = true;
      _that.$api.addResearchTree({
        fmeaId: _that.$store.getters.fmeaId,
        addResearchIds: _that.addCheckedData,
        delResearchIds: _that.delCheckedData,
        mfmeaResearchTreeDescVOS: [
          {
            faultId: lastCheckedNode.id,
            functionId: functionNode.id,
            struId: structureNode.id,
          }
        ]
      }).then(res => {
        if (res.flag) {
          // 操作成功，刷新右侧树，关闭模态框。
          _that.$message.success(res.message, 1);
          _that.initRightTree();
          _that.closeModal();
        } else {
          _that.$message.error(res.message, 1);
        }
      }).finally(() => {
        _that.saveLoading = false;
      });
    },
    /**
     * 问题编号输入事件时
     * @param e
     */
    issueCodeChange(e) {
      this.searchParams.issueCode = e.target.value || undefined;
    },
    /**
     * 标题输入事件时
     * @param e
     */
    titleChange(e) {
      this.searchParams.title = e.target.value || undefined;
    },
    /**
     * 责任人输入事件时
     * @param e
     */
    responsibleChange(e) {
      this.searchParams.responsible = e.target.value || undefined;
    },
    /**
     * SVPPS输入事件时
     * @param e
     */
    svppsChange(e) {
      this.searchParams.svpps = e.target.value || undefined;
    },
    /**
     * 项目输入事件时
     * @param e
     */
    projectChange(e) {
      this.searchParams.project = e.target.value || undefined;
    },
    /**
     * 关闭日期选择事件时
     * @param date
     * @param dateString
     */
    closeDateChange(date, dateString) {
      this.tg1Date = date;
      this.searchParams.pqcpCloseStartDate = dateString[0] || undefined;
      this.searchParams.pqcpCloseEndDate = dateString[1] || undefined;
    },
    /**
     * 来源选择事件时
     * @param val
     */
    sourceChange(val) {
      this.searchParams.source = val;
    },
    /**
     * 种类选择输事件时
     * @param val
     */
    typeChange(val) {
      this.searchParams.type = val;
    },
    /**
     * 表格点击分页中数字触发的方法
     * @param pagination 分页
     * @param filters 过滤
     * @param sorter 排序
     * @param currentDataSource 当前数据源
     */
    tableChange(pagination, filters, sorter, {currentDataSource}) {
      let _that = this;
      _that.pagination.current = pagination.current;
      _that.pagination.pageSize = pagination.pageSize;
      _that.searchParams.pageNo = pagination.current;
      _that.searchParams.pageSize = pagination.pageSize;
      _that.list();
    },
    /**
     * 复选框改变事件
     * @param selectedRowKeys
     * @param rows
     */
    onSelectChange(selectedRowKeys, rows) {
      this.selectedRowKeys = selectedRowKeys;
      this.selectedRows = rows;
    },
    /**
     * 行点击事件
     * @param record
     * @param index
     */
    customRow(record, index) {
      let _that = this;
      return {
        on: {
          // 鼠标单击行
          click: () => {
            if (_that.selectedRowKeys.indexOf(index) !== -1) {
              _that.selectedRows.splice(_that.selectedRowKeys.indexOf(index), 1);
              _that.selectedRowKeys.splice(_that.selectedRowKeys.indexOf(index), 1);
            } else {
              _that.selectedRowKeys.push(index)
              _that.selectedRows.push(record);
            }
          }
        }
      };
    },
    toDetail(row, type) {
      this.$router.push({
        path: "/analyse",
        query: {
          id: row.id,
          type: type,
          fmeaId: this.$store.getters.fmeaId,
          rfmeaId: this.$store.getters.rfmeaId,
          from: this.$route.query.from,
          back: this.$route.query.back,
          ntimet: new Date().getTime()
        }
      });
    },
    // 切换全屏
    changeFullScreen() {
      this.fullScreenFlag = !this.fullScreenFlag;
      if (this.fullScreenFlag) {
        this.topValue = {top: 0};
        this.bodyStyle = {height: '100vh'};
        this.widthValue = '100vw';
      } else {
        this.topValue = {};
        this.bodyStyle = {};
        this.widthValue = 1000;
      }
    }
  },
  mounted() {
    // 监听页面窗体大小变化
    window.addEventListener('resize', this.handleResize);
  },
  //剔除页面窗体大小变化得监听事件
  beforeDestroy() {
    window.removeEventListener('resize', this.handleResize);
  },
  destroyed() {
    this.closeModal();
  }
};
</script>


<style lang="less" scoped>

/deep/ .ant-table-title {
  color: rgba(0, 0, 0, 0.85);
  font-weight: 700;
}

.fullScreen {
  cursor: pointer;
  position: absolute;
  right: 60px;
  color: gray;
  margin-top: 3px;
}
/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>
