<template>
  <a-modal
      class="full-modal"
      :title="$t('functional-analysis.top-modal.recycle-bin')"
      :visible="modalVisible"
      :maskClosable="false"
      @cancel="closeModal"
      :keyboard="false"
      width="100%"
      destroy-on-close
      :footer="false"
      @afterClose="closeModal">
    <div ref="recycleBinModal">
      <a-card class="mb_8">
        <div class="recycleBinModal-form">
          <a-form layout='vertical'>
            <a-spin :spinning="loading">
              <a-row :gutter='24'>
                <a-col :xl="6" :md="12" :sm="24">
                  <a-form-item :label="$t('functional-analysis.top-modal.node-name')">
                    <a-input
                        allowClear
                        v-model="formData.nodeName"
                        :placeholder="$t('functional-analysis.top-modal.enter-node-name')"/>
                  </a-form-item>
                </a-col>
                <a-col :xl="6" :md="12" :sm="24">
                  <a-form-item :label="$t('functional-analysis.top-modal.node-type')">
                    <a-select
                        allowClear
                        v-model="formData.nodeTypeCode"
                        :placeholder="$t('functional-analysis.top-modal.please-select')"
                    >
                      <a-select-option v-for="item in nodeTypeList" :value="item.typeCode">
                        {{ item.typeName }}
                      </a-select-option>
                    </a-select>
                  </a-form-item>
                </a-col>
                <a-col :xl="6" :md="12" :sm="24">
                  <a-form-item :label="$t('functional-analysis.top-modal.deleted-by')">
                    <a-input
                        allowClear
                        v-model="formData.deleter"
                        :placeholder="$t('functional-analysis.top-modal.enter-the-deleted-by')"/>
                  </a-form-item>
                </a-col>
                <a-col :xl="6" :md="12" :sm="24">
                  <a-form-item :label="$t('functional-analysis.top-modal.delete-time')">
                    <a-range-picker
                        allowClear
                        v-model="formData.deletionTime"
                        @change="closeTimeChange"
                    />
                  </a-form-item>
                </a-col>
              </a-row>
              <a-row>
                <a-col :md="24" :sm="24">
                  <a-form-item class="tr mt-2">
                    <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-spin>
          </a-form>
        </div>
      </a-card>
    </div>
    <div class="mt10">
      <a-card>
        <template slot="title">
          <a-button class="ml10" type="primary" @click="exportExcel">
            {{ $t("global-btn.export") }}
          </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('global-constant.setting.col'))"></a-button>
          </a-dropdown>
        </template>
        <a-table
            id="recycle-bin-table"
            size="small"
            ref='tableRef'
            bordered
            :components='components'
            :pagination="pagination"
            :columns='sortedColumns.filter(column => column.visible)'
            :dataSource="tableData"
            :loading="tableLoading"
            :rowKey="(record, index) => {return index;}"
            :scroll='{ x: scrollWidth, y: tableHeightValue }'
            @change="handlePageChange">
          <template slot="action" slot-scope="text, record">
          <span class="operation-btn" style="margin: 0 6px !important; color: #1890FF">
            <a class="operation-btn" @click="recovery(record)">
              <a-tooltip :title="$t('functional-analysis.top-modal.recovery')">
                <i class="iconfont iconhuifushanchu"></i>
              </a-tooltip>
            </a>
          </span>
          </template>
          <template slot="struTypeCode" slot-scope="text, row">
            {{
              row.struTypeCode === '01'
                  ? $t("functional-analysis.top-btn.recycle-bin.structure") : row.struTypeCode === '02'
                      ? $t("functional-analysis.top-btn.recycle-bin.function") : row.struTypeCode === '04'
                          ? $t("functional-analysis.top-btn.recycle-bin.product-characteristics") : row.struTypeCode === '05'
                              ? $t("functional-analysis.top-btn.recycle-bin.requirements") : row.struTypeCode === '06'
                                  ? $t("functional-analysis.top-btn.recycle-bin.failure") : row.struTypeCode === '14'
                                      ? $t("functional-analysis.top-btn.recycle-bin.current-measures") : row.struTypeCode === '07'
                                          ? $t("functional-analysis.top-btn.recycle-bin.optimization-measures") : row.struTypeCode === '08'
                                              ? $t("functional-analysis.top-btn.recycle-bin.measures-group") : row.struTypeCode === '09'
                                                  ? $t("functional-analysis.top-btn.recycle-bin.preventive-measures") : row.struTypeCode === '10'
                                                      ? $t("functional-analysis.top-btn.recycle-bin.detection-measures") : row.struTypeCode === '99'
                                                          ? $t("functional-analysis.top-btn.recycle-bin.interface")
                                                          : ""
            }}
          </template>
          <template slot="nodeName" slot-scope="text, row">
          <span :class="getNodeClass(row)">
            {{ row.nodeName }}
          </span>
          </template>
          <!-- 序号 -->
          <template slot="sortNumber" slot-scope="text, row, index">
            {{ (pagination.current - 1) * pagination.pageSize + 1 + index }}
          </template>
        </a-table>
        <!-- 导出 -->
        <a-modal
            :title="$t('global-btn.export')"
            :width="400"
            :visible='exportVisible'
            :maskClosable="false"
            @cancel="closeExportModal"
            @ok="exportFile"
            :okText="$t('global-btn.export')">
          <div>
            <h3>{{ $t('global-btn.please-select-export-type') }}</h3>
            <a-radio-group v-model="exportType">
              <a-radio value="1" class="mr-4">{{ $t('global-btn.export-by-the-selected-columns') }}</a-radio>
              <a-radio value="0">{{ $t('global-btn.export-default-table-columns') }}</a-radio>
            </a-radio-group>
          </div>
        </a-modal>
      </a-card>
    </div>
  </a-modal>
</template>

<script>
import draggable from 'vuedraggable';
import VueDraggableResizable from 'vue-draggable-resizable';

export default {
  name: "RecycleBinModal",
  components: {
    VueDraggableResizable,
    draggable
  },
  props: {
    showRecycleBinModal: {
      type: Boolean,
      default: false
    }
  },
  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 {
      // 导出弹框
      exportVisible: false,
      // 导出类型
      exportType: '1',
      // 表格id
      tableId: '',
      // 复选框控制的状态
      columnVisibilities: {
        serialNumber: true,
        nodeName: true,
        struTypeCode: true,
        deleter: true,
        deleteTime: true,
        action: true
      },
      startDrag: false,
      editColumnVisibilities: [],
      sortedColumns: [], // 用于拖拽的列数组
      tableHeight: 0,
      tableHeightValue: 0,
      scrollWidth: 0,
      /** 模态框是否可见 */
      modalVisible: false,
      /** 加载中状态 */
      loading: false,
      tableLoading: false,
      /** 表单数据 */
      formData: {
        nodeName: undefined, // 节点名称
        nodeTypeCode: undefined, // 节点类型
        deleter: undefined, // 删除者
        deletionTime: undefined, // 删除时间
        deleteStartTime: undefined, // 删除开始时间
        deleteEndTime: undefined // 删除结束时间
      },
      /** 表格数据 */
      tableData: [],
      /** 表格分页 */
      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 // 总条数
      },
      listQuery: {
        pageNo: 1,
        pageSize: 10,
        fmeaId: this.$store.getters.rfmeaId,
      },
      /** 高亮节点数据 */
      highLightData: [],
      treeFlag: '',
      /** 每行数据 */
      rowData: [],
      /** 表头 */
      tableColumns: [
        // 序号
        {
          title: "fmea.node.recycle.bin.export.title.serialNumber",
          align: "center",
          dataIndex: "serialNumber",
          width: 100,
          scopedSlots: {
            customRender: "sortNumber"
          },
          visible: true,
          cantHide: true,
          cantHandle: true,
          ellipsis: true
        },
        // 节点名称
        {
          title: 'fmea.node.recycle.bin.export.title.nodeName',
          align: "center",
          dataIndex: "nodeName",
          scopedSlots: {
            customRender: "nodeName"
          },
          width: 300,
          visible: true,
          ellipsis: true
        },
        // 节点类型
        {
          title: 'fmea.node.recycle.bin.export.title.nodeType',
          align: "center",
          dataIndex: "struTypeCode",
          scopedSlots: {
            customRender: "struTypeCode"
          },
          width: 300,
          visible: true,
          ellipsis: true
        },
        // 删除者
        {
          title: 'fmea.node.recycle.bin.export.title.deleter',
          align: "center",
          dataIndex: "deleter",
          width: 300,
          visible: true,
          ellipsis: true
        },
        // 删除时间
        {
          title: 'fmea.node.recycle.bin.export.title.deletionTime',
          align: "center",
          dataIndex: "deleteTime",
          width: 300,
          visible: true,
          ellipsis: true
        },
        // 操作
        {
          title: 'research.operate',
          dataIndex: "action",
          width: 100,
          align: "center",
          scopedSlots: {
            customRender: "action"
          },
          ellipsis: true,
          cantHide: true,
          cantHandle: true,
          visible: true,
        }
      ],
      /** 节点类型集合 */
      nodeTypeList: [
        {
          typeCode: "01",
          typeName: this.$t("functional-analysis.top-btn.recycle-bin.structure")
        },
        {
          typeCode: "02",
          typeName: this.$t("functional-analysis.top-btn.recycle-bin.function")
        },
        {
          typeCode: "04",
          typeName: this.$t("functional-analysis.top-btn.recycle-bin.product-characteristics")
        },
        {
          typeCode: "05",
          typeName: this.$t("functional-analysis.top-btn.recycle-bin.requirements")
        },
        {
          typeCode: "06",
          typeName: this.$t("functional-analysis.top-btn.recycle-bin.failure")
        },
        {
          typeCode: "14",
          typeName: this.$t("functional-analysis.top-btn.recycle-bin.current-measures")
        },
        {
          typeCode: "07",
          typeName: this.$t("functional-analysis.top-btn.recycle-bin.optimization-measures")
        },
        {
          typeCode: "08",
          typeName: this.$t("functional-analysis.top-btn.recycle-bin.measures-group")
        },
        {
          typeCode: "09",
          typeName: this.$t("functional-analysis.top-btn.recycle-bin.preventive-measures")
        },
        {
          typeCode: "10",
          typeName: this.$t("functional-analysis.top-btn.recycle-bin.detection-measures")
        }
      ]
    }
  },
  watch: {
    sortedColumns: {
      handler() {
        this.$nextTick(() => {
          // 获取表格滚动区域的总宽度
          let scrollX = $('#recycle-bin-table .ant-table-fixed').width();
          // 获取表格的总宽度
          let tableWidth = $('#recycle-bin-table .ant-table-body').width();
          // a-table的scrollX宽度需要减去固定列宽度
          this.scrollWidth = scrollX - 200;
          if (scrollX <= tableWidth) {
            this.cancelFixedColmuns();
          } else {
            this.reloadFixedColmuns([], []);
          }
        });
      },
      deep: true,
      immediate: true
    },
    advanceExpand: {
      handler() {
        this.$nextTick(() => {
          this.handleResize();
        });
      }
    },
    showRecycleBinModal(val) {
      this.modalVisible = val;
    }
  },
  mounted() {
    // 监听页面窗体大小变化
    window.addEventListener('resize', this.handleResize);
  },
  //剔除页面窗体大小变化得监听事件
  beforeDestroy() {
    window.removeEventListener('resize', this.handleResize);
  },
  methods: {
    /**
     * 初始化加载已保存的表格列顺序及显隐
     */
    async initTableColumns() {
      // 获取用户信息，如果当前组件的userInfo为空，则从localStorage中获取
      let userInfo = JSON.parse(localStorage.getItem("userInfo"));
      // 获取页面中所有的表格容器
      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: userInfo.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['recycle-bin-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: 'recycle-bin-table'
      };
      // 调用API保存表格配置
      this.$api.saveTableConfig(data).then(res => {
        // 如果返回结果中的flag为true，表示保存成功
        if (res.flag) {
          // 显示成功提示信息
          this.$message.success(res.message, 1);
          // 重新初始化数据
          this.initData();
        } else {
          // 显示错误提示信息
          this.$message.error(res.message, 1);
        }
      }).finally(() => {
        // 重新初始化数据
        this.initData();
      });
    },
    /**
     * 处理表格列显隐复选框变化事件
     *
     * @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 无返回值
     */
    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';
        }
      });
    },
    /**
     * 处理窗口大小调整事件
     *
     * @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 = $('#recycle-bin-table .ant-table-fixed').width() - 200;
      // 获取表格的总宽度
      let tableWidth = $('#recycle-bin-table .ant-table-body').width();
      // 超过2K屏时取消固定列
      if (width > 2560 || scrollX <= tableWidth) {
        this.cancelFixedColmuns();
      } else {
        this.reloadFixedColmuns([], []);
      }
    },
    // 导出弹窗关闭
    closeExportModal() {
      this.exportVisible = false;
      this.exportType = '1';
    },
    // 导出弹窗
    async exportExcel() {
      let userInfo = JSON.parse(localStorage.getItem("userInfo"));
      // 查询表格列配置信息
      let tableConfigData = {
        userId: userInfo.userId,
        pagePath: this.$route.path,
        pageName: this.$route.name,
      };
      await this.$api.getTableColumnsData(tableConfigData).then(res => {
        if (res.flag) {
          if (res.data.currentTableConfigMap && Object.keys(res.data.currentTableConfigMap).length > 0) {
            // 获取当前表格的配置信息
            let tableConfig = res.data.currentTableConfigMap['recycle-bin-table'];
            if (tableConfig) {
              this.tableId = tableConfig.id;
            }
          }
        }
      });
      this.exportVisible = true;
    },
    // 导出文件
    exportFile() {
      let tableId = this.tableId || ''; // 表格id
      let exportType = this.exportType; // 导出类型
      // 查询条件
      let fmeaId = this.$store.getters.rfmeaId || '';
      let nodeName = this.formData.nodeName || '';
      let struTypeCode = this.formData.nodeTypeCode || '';
      let deleter = this.formData.deleter || '';
      let startTime = this.formData.deleteStartTime || '';
      let endTime = this.formData.deleteEndTime || '';

      let url = this.$api.baseUrl + "/DFMEA/rdfm/recycle/exportExcel?";
      url += "rfmeaId=" + fmeaId + "&nodeName=" + nodeName + "&struTypeCode=" + struTypeCode +
          "&deleter=" + deleter + "&startTime=" + startTime + "&endTime=" + endTime +
          "&tableId=" + tableId + "&exportType=" + exportType;
      window.open(url);
      this.closeExportModal();
    },
    /**
     * 列表
     */
    initData() {
      let _that = this;
      _that.tableLoading = true;
      let data = {
        rfmeaId: _that.$store.getters.rfmeaId,
        nodeName: _that.formData.nodeName,
        struTypeCode: _that.formData.nodeTypeCode,
        deleter: _that.formData.deleter,
        startTime: _that.formData.deleteStartTime,
        endTime: _that.formData.deleteEndTime,
        pagination: {
          pageCurrent: _that.pagination.current,
          pageSize: _that.pagination.pageSize
        }
      };
      _that.$api.getRecycleList(data).then((res) => {
        if (res.flag) {
          this.tableData = res.data.data;
          this.pagination.total = res.data.total;
        } else {
          this.$message.error(res.messsage, 1);
        }
      }).finally(() => {
        _that.tableLoading = false;
      });
    },
    /**
     * 时间变更
     */
    closeTimeChange(data, dataString) {
      if (!dataString) {
        this.formData.deletionTime = "";
        this.formData.deleteStartTime = "";
        this.formData.deleteEndTime = "";
        return;
      }
      this.formData.deletionTime = dataString;
      this.formData.deleteStartTime = dataString[0];
      this.formData.deleteEndTime = dataString[1];
    },
    /**
     * 重置
     */
    reset() {
      this.formData.nodeName = undefined;
      this.formData.deletionTime = undefined;
      this.formData.nodeTypeCode = undefined;
      this.formData.deleter = undefined;
      this.formData.deleteStartTime = undefined;
      this.formData.deleteEndTime = undefined;
      this.listQuery.pageNo = 1;
      this.pagination.current = 1;
      this.initData();
    },
    /**
     * 查询
     */
    search() {
      this.pagination.current = 1;
      this.initData();
    },
    /**
     * 恢复
     */
    recovery(record) {
      let _that = this;
      _that.loading = true;
      let recoveryData = {
        rfmeaId: _that.$store.getters.rfmeaId,
        recycleId: record.recycleId,
        struId: record.struId,
      };
      _that.$api.recoveryData(recoveryData).then((res) => {
        if (res.flag) {
          _that.$message.success(res.message, 1);
          if (res.data !== null) {
            _that.highLightData.push(res.data);
            _that.highLightData.push(res.inputData);
            // 高亮恢复节点
            _that.$emit("setHighLightNode", _that.highLightData);
          }
          this.$emit("initLeftTree");
          this.$emit("initRightTree");
        } else {
          _that.$message.err(res.message, 1);
        }
      }).finally(() => {
        _that.loading = false;
        _that.closeModal();
      })
    },
    /**
     * 分页
     */
    handlePageChange(pagination) {
      this.listQuery.pageSize = pagination.pageSize;
      this.listQuery.pageNo = pagination.current;
      this.pagination.current = pagination.current;
      this.pagination.pageSize = pagination.pageSize;
      this.initData();
    },
    /**
     * 动态生成节点的Class，满足不同类型节点样式不一样
     * @param row 节点
     */
    getNodeClass(row) {
      if (row.struTypeCode === '02') { // 功能
        return 'function-color';
      } else if (row.struTypeCode === '04' || row.struTypeCode === '05') { // 产品特性,要求
        return 'productFeature-require-color';
      } else if (row.struTypeCode === '06') { // 失效
        return 'fault-color';
      } else {
        return 'other-color';
      }
    },
    /**
     * 关闭模态框
     */
    closeModal() {
      this.formData = {};
      this.highLightData = [];
      this.$emit("closeModal");
    },
  }
}
</script>
<style lang="less" scoped>
.function-color {
  color: rgb(66, 167, 94);
}

.product-process-Feature-require-color {
  color: #5b9bd5;
}

.fault-color {
  color: rgb(200, 77, 60);
}
.other-color {
  color: black;
}
</style>


