<template>
  <div ref="DRBFM" class="summary-archive-content">
<!--    <div class="summary-archive-content-card" :style="{ height: chartHeight }">-->
    <a-card>
      <div class="DRBFM-from">
        <a-form layout="vertical">
          <a-row :gutter="24">
            <a-col :xl="8" :lg="8" :md="12" :sm="24" :xs="24">
              <a-form-item :label="$t('summary-Archive.fmea-table.structure')">
                <!-- 勾选模式选择 -->
                <span class="radio-group-class" >
                  <a-radio-group @change="radioChange" :default-value="1" size="small">
                    <a-radio :value="2" class="level-radio">
                      <a-tooltip>
                        <template slot="title">
                          {{ $t('summary-archive.fmea-table.same-level-check') }}
                        </template>
                        {{ $t('summary-archive.fmea-table.same-level-check') }}
                      </a-tooltip>
                    </a-radio>
                    <a-radio :value="3" class="level-radio">
                      <a-tooltip>
                        <template slot="title">
                          {{ $t('summary-archive.fmea-table.check-with-same-superior') }}
                        </template>
                        {{ $t('summary-archive.fmea-table.check-with-same-superior') }}
                      </a-tooltip>
                    </a-radio>
                    <a-radio :value="1" class="level-radio">
                      <a-tooltip>
                        <template slot="title">
                          {{ $t('summary-archive.fmea-table.unlimited') }}
                        </template>
                        {{ $t('summary-archive.fmea-table.unlimited') }}
                      </a-tooltip>
                    </a-radio>
                  </a-radio-group>
                </span>
                <a-tree-select ref="leftTree" v-model="searchParams.struId" treeCheckable treeCheckStrictly
                  :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }" :placeholder="$t('summary-Archive.fmea-table.please-select-a-structure')
                    " allow-clear show-search :showArrow="true" tree-default-expand-all :replaceFields="replaceFields"
                  :filterTreeNode="filterTreeNode" :tree-data="treeData" @select="selectBtn" @change="treeSelectChange">
                  <template #title="{ value: val, title }">
                    <template>{{ title }}</template>
                  </template>
                </a-tree-select>
              </a-form-item>
            </a-col>
            <!-- 第二语言添加下拉选择框------zj 2023/05/29 start-->
            <a-col :xl="6" :lg="8" :md="12" :sm="24" :xs="24">
              <a-form-item :label="$t('summary-Archive.fmea-table.second-language')">
                <a-select v-model="searchParams.twoLanguage" :placeholder="$t(
                  'summary-Archive.fmea-table.pleae-select-second-language'
                )
                  " :loading="secondLanguageLoading">
                  <a-select-option v-for="(item, index) in secondLanguages" :key="index" :value="item.lkey">
                    {{ $t("global-dict.select-nls." + item.lkey) }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
            <!-- 第二语言添加------zj 2023/05/29 end-->
            <a-col :xl='10' :lg='8' :md='24' :sm='24' :xs='24'>
              <a-form-item class='tr' :label="'\xa0'">
                <a-button type="primary"  @click="search">
                  {{ $t("global-btn.search") }}
                </a-button>
              </a-form-item>
            </a-col>
          </a-row>
        </a-form>
      </div>
    </a-card>
    <a-card style="border-radius:10px 10px 0px 0px">
      <template slot="extra">
        <a-row class='tr'>
          <a-button type="primary" @click="excelExport">
            {{ $t("global-btn.export") }}
          </a-button>
        </a-row>
      </template>
      <div :style="{ height: chartHeight }">
        <a-table :data-source="tableData" :columns="tableColumns" :rowKey="(row, index) => {
            return index;
          }
          " bordered size="small" :loading="tableLoading" :scroll="{ x: 2250, y: tableHeightValue }" @change="tableChange"
          :pagination="pagination">
          <template slot="functionName" slot-scope="text, record, index">
            <span :title="getFunctionName(record)">
              {{ getFunctionName(record) }}
            </span>
          </template>
          <!-- 第二语言添加------zj 2023/05/30 start-->
          <span slot="structureName" slot-scope="text">
            <template v-for="(item, index) in text">
              <div :key="index" v-html="item"></div>
            </template>
          </span>
          <span slot="functionName" slot-scope="text">
            <template v-for="(item, index) in text">
              <div :key="index" v-html="item"></div>
            </template>
          </span>
          <span slot="frModeName" slot-scope="text">
            <template v-for="(item, index) in text">
              <div :key="index" v-html="item"></div>
            </template>
          </span>
          <span slot="frCauseName" slot-scope="text">
            <template v-for="(item, index) in text">
              <div :key="index" v-html="item"></div>
            </template>
          </span>
          <span slot="frEffectName" slot-scope="text">
            <template v-for="(item, index) in text">
              <div :key="index" v-html="item"></div>
            </template>
          </span>
          <span slot="frCauseActionName" slot-scope="text">
            <template v-for="(item, index) in text">
              <div :key="index" v-html="item"></div>
            </template>
          </span>
          <span slot="frCauseOptiActionDName" slot-scope="text">
            <template v-for="(item, index) in text">
              <div :key="index" v-html="item"></div>
            </template>
          </span>
          <!-- 第二语言添加------zj 2023/05/30 end-->
        </a-table>
      </div>
    </a-card>
  </div>
<!--  </div>-->
</template>

<script>
import { arrayToTree } from "@/utils/tree";
import { getTbCellBorderStyle } from "@/utils/TdBorderUtil";

export default {
  name: "DRBFM",
  data() {
    return {
      deepCurrent: '', // 当前选中的层级
      checkIdShow: false, // 同级勾选是否启动
      sameSuperCheckFlag: false, // 同父级勾选是否启动
      checkedEvet: false, // 判断是勾选还是删除
      currentChecked: [], // 完全受控数据
      struNodeList: [], // 节点下拉选原始数据
      /** 表格数据 */
      tableData: [],
      /** 表格列头 */
      tableColumns: [
        {
          title: () => this.$t("summary-Archive.drbfm.stru"),
          width: 180,
          align: "center",
          dataIndex: "structureName",
          customCell: (record, index) => {
            return {
              style:
                index === 0
                  ? getTbCellBorderStyle(0, 0, record.cellStyleStructure)
                  : getTbCellBorderStyle(
                    record.cellStyleStructure,
                    0,
                    record.cellStyleStructure
                  )
            };
          },
          // 第二语言添加------zj 2023/05/30 start
          customRender: (text, record) => {
            if (record.structureName != null) {
              if (record.structureSecondLanguage == null || record.structureSecondLanguage === record.structureName) {
                record.structureSecondLanguage = "";
              }
              // 创建一个包含结构名的 span 元素
              let nameElement = this.$createElement('span', record.structureName + ' ' + record.structureSecondLanguage);
              // 当鼠标移入时，悬浮显示隐藏内容
              let aTooltipElement = this.$createElement('a-tooltip', {
                props: {
                  title: record.structureName + record.structureSecondLanguage
                }
              }, [nameElement]); // 创建 a-tooltip 组件，并将 span 元素作为 children 传递进去
              // 将 span 和 a-tooltip 分别作为 children 添加到div中
              let child = this.$createElement('div', {
                children: [nameElement]
              }, [aTooltipElement]);
              return child;
            }
          },
          // 第二语言添加------zj 2023/05/30 end
          ellipsis: true
        },
        {
          title: () => this.$t("summary-Archive.drbfm.function"),
          width: 150,
          align: "center",
          dataIndex: "functionName",
          scopedSlots: { customRender: "functionName" },
          customCell: (record, index) => {
            return {
              style:
                index === 0
                  ? getTbCellBorderStyle(
                    0,
                    record.cellStyleStructure,
                    record.cellStyleFunction
                  )
                  : getTbCellBorderStyle(
                    record.cellStyleFunction,
                    record.cellStyleStructure,
                    record.cellStyleFunction
                  )
            };
          },
          // 第二语言添加------zj 2023/05/30 start
          customRender: (text, record) => {
            if (record.functionName != null) {
              if (record.functionSecondLanguage == null || record.functionSecondLanguage === record.functionName) {
                record.functionSecondLanguage = "";
              }
              // 创建一个包含结构名的 span 元素
              let nameElement = this.$createElement('span', record.functionName + ' ' + record.functionSecondLanguage)
              // 当鼠标移入时，悬浮显示隐藏内容
              let aTooltipElement = this.$createElement('a-tooltip', {
                props: {
                  title: record.functionName + record.functionSecondLanguage
                }
              }, [nameElement]);// 创建 a-tooltip 组件，并将 span 元素作为 children 传递进去
              // 将 span 和 a-tooltip 分别作为 children 添加到div中
              let child = this.$createElement('div', {
                children: [nameElement]
              }, [aTooltipElement]);
              return child;
            }
          },
          // 第二语言添加------zj 2023/05/30 end
          ellipsis: true
        },
        {
          title: () => this.$t("summary-Archive.drbfm.fault-mode"),
          align: "center",
          dataIndex: "about",
          children: [
            {
              title: () => this.$t("summary-Archive.drbfm.frmode-gene1"),
              width: 180,
              align: "center",
              dataIndex: "frModeName",
              customCell: (record, index) => {
                return {
                  style:
                    index === 0
                      ? getTbCellBorderStyle(
                        0,
                        record.cellStyleFunction,
                        record.cellStyleFrMode
                      )
                      : getTbCellBorderStyle(
                        record.cellStyleFrMode,
                        record.cellStyleFunction,
                        record.cellStyleFrMode
                      )
                };
              },
              // 第二语言添加------zj 2023/05/30 start
              customRender: (text, record) => {
                if (record.frModeName != null) {
                  if (record.failureModeSecondLanguage == null || record.failureModeSecondLanguage === record.frModeName) {
                    record.failureModeSecondLanguage = "";
                  }
                  // 创建一个包含结构名的 span 元素
                  let nameElement = this.$createElement('span', record.frModeName + ' ' + record.failureModeSecondLanguage);
                  // 当鼠标移入时，悬浮显示隐藏内容
                  let aTooltipElement = this.$createElement('a-tooltip', {
                    props: {
                      title: record.frModeName + record.failureModeSecondLanguage
                    }
                  }, [nameElement]);// 创建 a-tooltip 组件，并将 span 元素作为 children 传递进去
                  // 将 span 和 a-tooltip 分别作为 children 添加到div中
                  let child = this.$createElement('div', {
                    children: [nameElement]
                  }, [aTooltipElement]);
                  return child;
                }
              },
              // 第二语言添加------zj 2023/05/30 end
              ellipsis: true
            },
            {
              title: () => this.$t("summary-Archive.drbfm.frmode-gene2"),
              width: 120,
              align: "center",
              customCell: (record, index) => {
                return {
                  style:
                    index === 0
                      ? getTbCellBorderStyle(
                        0,
                        record.cellStyleFrMode,
                        record.cellStyleFrMode
                      )
                      : getTbCellBorderStyle(
                        record.cellStyleFrMode,
                        record.cellStyleFrMode,
                        record.cellStyleFrMode
                      )
                };
              },
              ellipsis: true
            }
          ],
          ellipsis: true
        },
        {
          title: () => this.$t("summary-Archive.drbfm.fault-cause"),
          align: "center",
          dataIndex: "fail",
          children: [
            {
              title: () => this.$t("summary-Archive.drbfm.frcause-gene1"),
              width: 120,
              align: "center",
              dataIndex: "frCauseName",
              customCell: (record, index) => {
                return {
                  style:
                    index === 0
                      ? getTbCellBorderStyle(
                        0,
                        record.cellStyleFrMode,
                        record.cellStyleFrCause
                      )
                      : getTbCellBorderStyle(
                        record.cellStyleFrCause,
                        record.cellStyleFrMode,
                        record.cellStyleFrCause
                      )
                };
              },
              // 第二语言添加------zj 2023/05/30 start
              customRender: (text, record) => {
                if (record.frCauseName != null) {
                  if (record.failureCauseSecondLanguage == null || record.failureCauseSecondLanguage === record.frCauseName) {
                    record.failureCauseSecondLanguage = "";
                  }
                  // 创建一个包含结构名的 span 元素
                  let nameElement = this.$createElement('span', record.frCauseName + ' ' + record.failureCauseSecondLanguage);
                  // 当鼠标移入时，悬浮显示隐藏内容
                  let aTooltipElement = this.$createElement('a-tooltip', {
                    props: {
                      title: record.frCauseName + record.failureCauseSecondLanguage
                    }
                  }, [nameElement]);// 创建 a-tooltip 组件，并将 span 元素作为 children 传递进去
                  // 将 span 和 a-tooltip 分别作为 children 添加到div中
                  let child = this.$createElement('div', {
                    children: [nameElement]
                  }, [aTooltipElement]);
                  return child;
                }
              },
              // 第二语言添加------zj 2023/05/30 end
              ellipsis: true
            },
            {
              title: () => this.$t("summary-Archive.drbfm.frcause-gene2"),
              width: 150,
              align: "center",
              dataIndex: "additional",
              customCell: (record, index) => {
                return {
                  style:
                    index === 0
                      ? getTbCellBorderStyle(
                        0,
                        record.cellStyleFrCause,
                        record.cellStyleFrCause
                      )
                      : getTbCellBorderStyle(
                        record.cellStyleFrCause,
                        record.cellStyleFrCause,
                        record.cellStyleFrCause
                      )
                };
              },
              ellipsis: true,
              // 当鼠标移入时，悬浮显示隐藏内容
              customRender: (text, record) => <a-tooltip placement="topLeft" title={record.additional}>{record.additional}</a-tooltip>
            }
          ],
          ellipsis: true
        },
        {
          title: () => this.$t("summary-Archive.drbfm.fault-effect"),
          width: 150,
          align: "center",
          dataIndex: "frEffectName",
          customCell: (record, index) => {
            return {
              style:
                index === 0
                  ? getTbCellBorderStyle(
                    0,
                    record.cellStyleFrCause,
                    record.cellStyleFrEffect
                  )
                  : getTbCellBorderStyle(
                    record.cellStyleFrEffect,
                    record.cellStyleFrCause,
                    record.cellStyleFrEffect
                  )
            };
          },
          // 第二语言添加------zj 2023/05/30 start
          customRender: (text, record) => {
            if (record.frEffectName != null) {
              if (record.failureEffortSecondLanguage == null || record.failureEffortSecondLanguage === record.frEffectName) {
                record.failureEffortSecondLanguage = "";
              }
              // 创建一个包含结构名的 span 元素
              let nameElement = this.$createElement('span', record.frEffectName + ' ' + record.failureEffortSecondLanguage);
              // 当鼠标移入时，悬浮显示隐藏内容
              let aTooltipElement = this.$createElement('a-tooltip', {
                props: {
                  title: record.frEffectName + record.failureEffortSecondLanguage
                }
              }, [nameElement]);// 创建 a-tooltip 组件，并将 span 元素作为 children 传递进去
              // 将 span 和 a-tooltip 分别作为 children 添加到div中
              let child = this.$createElement('div', {
                children: [nameElement]
              }, [aTooltipElement]);
              return child;
            }
          },
          // 第二语言添加------zj 2023/05/30 end
          ellipsis: true
        },
        {
          title: () => this.$t("summary-Archive.drbfm.c"),
          width: 50,
          align: "center",
          dataIndex: "C",
          customCell: (record, index) => {
            return {
              style:
                index === 0
                  ? getTbCellBorderStyle(
                    0,
                    record.cellStyleFrEffect,
                    record.cellStyleFrEffect
                  )
                  : getTbCellBorderStyle(
                    record.cellStyleFrEffect,
                    record.cellStyleFrEffect,
                    record.cellStyleFrEffect
                  )
            };
          },
          ellipsis: true,
          // 当鼠标移入时，悬浮显示隐藏内容
          customRender: (text, record) => <a-tooltip placement="topLeft" title={record.C}>{record.C}</a-tooltip>
        },
        {
          title: () => this.$t("summary-Archive.drbfm.orgin-action"),
          width: 180,
          align: "center",
          dataIndex: "frCauseActionName",
          customCell: (record, index) => {
            return {
              style:
                index === 0
                  ? getTbCellBorderStyle(
                    0,
                    record.cellStyleFrEffect,
                    record.cellStyleInitAction
                  )
                  : getTbCellBorderStyle(
                    record.cellStyleInitAction,
                    record.cellStyleFrEffect,
                    record.cellStyleInitAction
                  )
            };
          },
          // 第二语言添加------zj 2023/05/30 start
          customRender: (text, record) => {
            if (record.frCauseActionName != null) {
              if (record.frCauseActionSecondLanguage == null || record.frCauseActionSecondLanguage === record.frCauseActionName) {
                record.frCauseActionSecondLanguage = "";
              }
              // 创建一个包含结构名的 span 元素
              let nameElement = this.$createElement('span', record.frCauseActionName + ' ' + record.frCauseActionSecondLanguage);
              // 当鼠标移入时，悬浮显示隐藏内容
              let aTooltipElement = this.$createElement('a-tooltip', {
                props: {
                  title: record.frCauseActionName + record.frCauseActionSecondLanguage
                }
              }, [nameElement]);// 创建 a-tooltip 组件，并将 span 元素作为 children 传递进去
              // 将 span 和 a-tooltip 分别作为 children 添加到div中
              let child = this.$createElement('div', {
                children: [nameElement]
              }, [aTooltipElement]);
              return child;
            }
          },
          // 第二语言添加------zj 2023/05/30 end
          ellipsis: true
        },
        {
          title: () => this.$t("summary-Archive.drbfm.opti-action"),
          align: "center",
          dataIndex: "recommendedAction",
          children: [
            {
              title: () => this.$t("summary-Archive.drbfm.design"),
              width: 150,
              align: "center",
              dataIndex: "frCauseOptiActionPName",
              customCell: (record, index) => {
                return {
                  style:
                    index === 0
                      ? getTbCellBorderStyle(
                        0,
                        record.cellStyleInitAction,
                        record.cellStyleOptiActionP
                      )
                      : getTbCellBorderStyle(
                        record.cellStyleOptiActionP,
                        record.cellStyleInitAction,
                        record.cellStyleOptiActionP
                      )
                };
              },
              // 第二语言添加------zj 2023/05/30 start
              customRender: (text, record) => {
                if (record.frCauseOptiActionPName != null) {
                  if (record.frCauseOptiActionSecondLanguage == null || record.frCauseOptiActionSecondLanguage === record.frCauseOptiActionPName) {
                    record.frCauseOptiActionSecondLanguage = "";
                  }
                  // 创建一个包含结构名的 span 元素
                  let nameElement = this.$createElement('span', record.frCauseOptiActionPName + ' ' + record.frCauseOptiActionSecondLanguage);
                  // 当鼠标移入时，悬浮显示隐藏内容
                  let aTooltipElement = this.$createElement('a-tooltip', {
                    props: {
                      title: record.frCauseOptiActionPName + record.frCauseOptiActionSecondLanguage
                    }
                  }, [nameElement]);// 创建 a-tooltip 组件，并将 span 元素作为 children 传递进去
                  // 将 span 和 a-tooltip 分别作为 children 添加到div中
                  let child = this.$createElement('div', {
                    children: [nameElement]
                  }, [aTooltipElement]);
                  return child;
                }
              },
              // 第二语言添加------zj 2023/05/30 end
              ellipsis: true
            },
            {
              title: () => this.$t("summary-Archive.drbfm.rd"),
              width: 150,
              align: "center",
              dataIndex: "frCauseOptiActionPRD",
              customCell: (record, index) => {
                return {
                  style:
                    index === 0
                      ? getTbCellBorderStyle(
                        0,
                        record.cellStyleOptiActionP,
                        record.cellStyleOptiActionP
                      )
                      : getTbCellBorderStyle(
                        record.cellStyleOptiActionP,
                        record.cellStyleOptiActionP,
                        record.cellStyleOptiActionP
                      )
                };
              },
              ellipsis: true,
              // 当鼠标移入时，悬浮显示隐藏内容
              customRender: (text, record) => <a-tooltip placement="topLeft" title={record.frCauseOptiActionPRD}>{record.frCauseOptiActionPRD}</a-tooltip>
            },
            {
              title: () => this.$t("summary-Archive.drbfm.test"),
              width: 150,
              align: "center",
              dataIndex: "frCauseOptiActionDName",
              customCell: (record, index) => {
                return {
                  style:
                    index === 0
                      ? getTbCellBorderStyle(
                        0,
                        record.cellStyleOptiActionP,
                        record.cellStyleOptiActionD
                      )
                      : getTbCellBorderStyle(
                        record.cellStyleOptiActionD,
                        record.cellStyleOptiActionP,
                        record.cellStyleOptiActionD
                      )
                };
              },
              ellipsis: true,
              // 当鼠标移入时，悬浮显示隐藏内容
              customRender: (text, record) => <a-tooltip placement="topLeft" title={record.frCauseOptiActionDName}>{record.frCauseOptiActionDName}</a-tooltip>
            },
            {
              title: () => this.$t("summary-Archive.drbfm.rd"),
              width: 150,
              align: "center",
              dataIndex: "frCauseOptiActionDRD",
              customCell: (record, index) => {
                return {
                  style:
                    index === 0
                      ? getTbCellBorderStyle(
                        0,
                        record.cellStyleOptiActionD,
                        record.cellStyleOptiActionD
                      )
                      : getTbCellBorderStyle(
                        record.cellStyleOptiActionD,
                        record.cellStyleOptiActionD,
                        record.cellStyleOptiActionD
                      )
                };
              },
              ellipsis: true,
              // 当鼠标移入时，悬浮显示隐藏内容
              customRender: (text, record) => <a-tooltip placement="topLeft" title={record.frCauseOptiActionDRD}>{record.frCauseOptiActionDRD}</a-tooltip>
            },
            {
              title: () => this.$t("summary-Archive.drbfm.product"),
              width: 150,
              align: "center",
              dataIndex: "production",
              customCell: (record, index) => {
                return {
                  style:
                    index === 0
                      ? getTbCellBorderStyle(
                        0,
                        record.cellStyleOptiActionD,
                        record.cellStyleFrCause
                      )
                      : getTbCellBorderStyle(
                        record.cellStyleFrCause,
                        record.cellStyleOptiActionD,
                        record.cellStyleFrCause
                      )
                };
              },
              ellipsis: true,
              // 当鼠标移入时，悬浮显示隐藏内容
              customRender: (text, record) => <a-tooltip placement="topLeft" title={record.production}>{record.production}</a-tooltip>
            },
            {
              title: () => this.$t("summary-Archive.drbfm.rd"),
              width: 150,
              align: "center",
              dataIndex: "rd",
              customCell: (record, index) => {
                return {
                  style:
                    index === 0
                      ? getTbCellBorderStyle(
                        0,
                        record.cellStyleFrCause,
                        record.cellStyleFrCause
                      )
                      : getTbCellBorderStyle(
                        record.cellStyleFrCause,
                        record.cellStyleFrCause,
                        record.cellStyleFrCause
                      )
                };
              },
              ellipsis: true,
              // 当鼠标移入时，悬浮显示隐藏内容
              customRender: (text, record) => <a-tooltip placement="topLeft" title={record.rd}>{record.rd}</a-tooltip>
            }
          ],
          ellipsis: true
        },
        {
          title: () => this.$t("summary-Archive.drbfm.action-effect"),
          align: "center",
          dataIndex: "measureEffect",
          customCell: (record, index) => {
            return {
              style:
                index === 0
                  ? getTbCellBorderStyle(
                    0,
                    record.cellStyleFrCause,
                    record.cellStyleEndColum
                  )
                  : getTbCellBorderStyle(
                    record.cellStyleEndColum,
                    record.cellStyleFrCause,
                    record.cellStyleEndColum
                  )
            };
          },
          ellipsis: true,
          // 当鼠标移入时，悬浮显示隐藏内容
          customRender: (text, record) => <a-tooltip placement="topLeft" title={record.measureEffect}>{record.measureEffect}</a-tooltip>
        }
      ],
      /** 表格分页 */
      pagination: {
        current: 1, // 当前页数
        pageSize: 10, // 每页条数
        showTotal: this.getShowTotal, // 用于显示数据总量和当前数据顺序
        showSizeChanger: false, // 是否可以改变 pageSize
        pageSizeOptions: ["10", "20", "50", "100", "200"], // 指定每页可以显示多少条
        onShowSizeChange: (current, pageSize) => (this.pageSize = pageSize), // pageSize 变化的回调
        total: 0 // 总条数
      },
      /** 实际总数 */
      realTotal: 0,
      /** 表格Loading */
      tableLoading: false,
      /** 树数据 */
      treeData: [],
      /** 替换 treeNode 中 title,key,children,value 字段为 treeData 中对应的字段 */
      replaceFields: {
        children: "children",
        label: "name",
        key: "id",
        value: "id"
      },
      /** 检索条件 */
      searchParams: {
        /** FMEA标识 */
        fmeaId: this.$store.getters.rfmeaId,
        /** 结构字符串 */
        struId: undefined,
        /** 分页 */
        pageCurrent: 1,
        pageSize: 10,
        /** 第二语言 */
        twoLanguage: undefined,
      },
      /** 第二语言 */
      secondLanguages: [],
      /** 第二语言Loading */
      secondLanguageLoading: false,
      /** 表格高度 */
      /** 表格高度 */
      tableHeightValue: window.innerHeight - 420,
      chartHeight: window.innerHeight - 125 + 'px'
    };
  },

  mounted() {
    // 获取第二语言
    this.getLanguageList();
    this.getTreeSelect();
    this.list();
    window.onresize = () => {
      this.chartHeight = window.innerHeight - 125 + 'px';
      this.tableHeightValue = window.innerHeight - 420;
    };
  },
  methods: {
    /**
     * 获取功能名称
     * @param row
     */
    getFunctionName(row) {
      let functionName = row.functionName || "";
      let requireName = row.requireName || "";
      return functionName + (requireName ? "(" + requireName + ")" : "");
    },
    /**
     * 获取分页总数
     */
    getShowTotal() {
      return this.$t("global-constant.table.show-total", [this.realTotal]);
    },
    /**
     * 输入项筛选
     * @param inputValue
     * @param treeNode
     */
    filterTreeNode(inputValue, treeNode) {
      return treeNode.data.props.name.includes(inputValue);
    },
    /**
     * 搜索
     */
    search() {
      this.list();
    },
    /**
     * 获取Tree下拉
     */
    getTreeSelect() {
      let _that = this;
      _that.$api
        .getLeftTree({
          fmeaId: _that.$store.getters.rfmeaId
        })
        .then(res => {
          if (res.flag) {
            _that.struNodeList = res.data.rdfmStruTreeModels;
            let targetNode = res.data.rdfmStruTreeModels.filter(item => {
              return item.pid === "00000000000000000000000000000000";
            })[0];
            // 数组转Tree
            _that.treeData = arrayToTree(
              targetNode,
              res.data.rdfmStruTreeModels
            );
          } else {
            _that.$message.error(res.message, 1);
          }
        })
        .catch(error => {
          _that.$message.error(error.response.data.message, 1);
        });
    },
    /**
     * Excel导出
     */
    excelExport() {
      let struIds = [];
      if (this.searchParams.struId && this.searchParams.struId.length > 0) {
        this.searchParams.struId.forEach(item => {
          struIds.push(item.value);
        })
      }
      let exportFrom = this.$com.getCookie("from");
      let rfmeaId = this.$store.getters.rfmeaId;
      let struId = struIds || "";
      let twoLanguage = this.searchParams.twoLanguage;
      let url =
        this.$api.baseUrl +
        "/DFMEA/rdfmDRBFMTable/Rb04261F1/export?fmeaId=" +
        rfmeaId +
        "&struIds=" +
        struId +
        "&twoLanguage=" +
        twoLanguage +
        "&exportFrom=" +
        exportFrom;
      window.open(url);
    },
    /**
     * 列表
     */
    list() {
      let _that = this;
      _that.tableLoading = true;
      let struIds = [];
      if (this.searchParams.struId && this.searchParams.struId.length > 0) {
        this.searchParams.struId.forEach(item => {
          struIds.push(item.value);
        })
      }
      let data = {
        fmeaId: this.$store.getters.rfmeaId,
        struIds: struIds || undefined,
        pageCurrent: _that.searchParams.pageCurrent
      };
      _that.$api
        .getDRBFM(data)
        .then(res => {
          if (res.flag) {
            _that.tableData = res.data.drbfmExports || [];
            let pagination = res.inputData.pagination;
            let len = _that.tableData.length;
            _that.pagination.current = pagination.pageCurrent;
            _that.pagination.pageSize = len;
            // 计算分页总数
            let multiple = Math.ceil(
              pagination.rowTotal / _that.searchParams.pageSize
            );
            _that.pagination.total = multiple * len;
            _that.realTotal = pagination.rowTotal;
          } else {
            _that.$message.error(res.message, 1);
          }
        })
        .catch(error => {
          _that.$message.error(error.response.data.message, 1);
        })
        .finally(() => {
          _that.tableLoading = false;
        });
    },
    /**
     * 单选框改变事件
     */
    radioChange(e) {
      let redioFlag = e.target.value;
      if (redioFlag === 1) {
        this.checkIdShow = false;
        this.sameSuperCheckFlag = false;
      } else if (redioFlag === 2) {
        this.checkIdShow = true;
        this.sameSuperCheckFlag = false;
      } else if (redioFlag === 3) {
        this.checkIdShow = false;
        this.sameSuperCheckFlag = true;
      }
    },
    /**
     * tree 完全受控  选中
     * @param even
     * @param evenT
     * @param evenTR
     */
    selectBtn(even, evenT, evenTR) {
      this.checkedEvet = true; //判断是勾选添加还是删除
      this.currentChecked = evenTR.checkedNodes;
      let i = evenTR.checkedNodes.length - 1;
      this.deepCurrent = evenTR.checkedNodes[i].data.props.deep; // 设置当前选择节点的深度
      this.currentPid = evenTR.checkedNodes[i].data.props.pid; // 设置当前选择节点的父级ID
    },
    /**
     * Tree下拉选择事件时
     * @param value
     * @param option
     */
    treeSelectChange(value, option) {
      this.searchParams.struId = value;
      let checkList = [];
      let checkIds = [];
      if (this.sameSuperCheckFlag == true) {
        //当同父级勾选按钮打开，并且是勾选添加时
        if (this.checkedEvet == true) {
          this.struNodeList.forEach(item => {
            if (item.deep == this.deepCurrent && item.pid == this.currentPid) checkList.push(item);
          });
          checkList.forEach(item => {
            let ids = {
              lable: item.name,
              value: item.id,
            }
            checkIds.push(ids);
          });
          let result = checkIds.concat(this.searchParams.struId);
          let arrayResult = result.filter((currentValue, currentIndex, selfArr) => {
            return selfArr.findIndex(item => item.value === currentValue.value) === currentIndex;
          });
          this.searchParams.struId = arrayResult;
          // 暂存选中数据，取消勾选时使用
          this.currentChecked = arrayResult;
        } else {
          //当同父级勾选按钮打开，并且是勾选取消时
          // 对比数组，找到当前勾选的层级
          let arr1 = this.currentChecked.filter(item => {
            return !this.searchParams.struId.find(prop => {
              return prop.value == item.value
            })
          });
          let currentUnCheckedNode = this.struNodeList.filter(item => {
            return item.id === arr1[0].value;
          })
          this.deepCurrent = currentUnCheckedNode[0] ? currentUnCheckedNode[0].deep : undefined;
          this.currentPid = currentUnCheckedNode[0] ? (currentUnCheckedNode[0].pid ? currentUnCheckedNode[0].pid : undefined) : undefined;
          //根据当前勾选的层级，找到所有相同的层级
          this.struNodeList.forEach(item => {
            if (item.deep == this.deepCurrent && item.pid == this.currentPid) checkList.push(item);
          });
          checkList.forEach(item => {
            let ids = {
              lable: item.name,
              value: item.id,
            }
            checkIds.push(ids);
          });
          //把找到相同数据的层级从勾选的数据中删除
          const result = this.searchParams.struId.filter((itemA) => {
            return !checkIds.some((itemB) => itemA.value == itemB.value);
          })
          this.searchParams.struId = result;
          this.currentChecked = result;
        }
      } else if (this.checkIdShow == true) {
        //当同级勾选按钮打开，并且是勾选添加时
        if (this.checkedEvet == true) {
          this.struNodeList.forEach(item => {
            if (item.deep == this.deepCurrent) checkList.push(item);
          });
          checkList.forEach(item => {
            let ids = {
              lable: item.name,
              value: item.id,
            }
            checkIds.push(ids);
          });
          let result = checkIds.concat(this.searchParams.struId);
          let arrayResult = result.filter((currentValue, currentIndex, selfArr) => {
            return selfArr.findIndex(item => item.value === currentValue.value) === currentIndex;
          });
          this.searchParams.struId = arrayResult;
          // 暂存选中数据，取消勾选时使用
          this.currentChecked = arrayResult;
        } else {
          //当同级勾选按钮打开，并且是勾选取消时
          // 对比数组，找到当前勾选的层级
          let arr1 = this.currentChecked.filter(item => {
            return !this.searchParams.struId.find(prop => {
              return prop.value == item.value
            })
          });
          let currentUnCheckedNode = this.struNodeList.filter(item => {
            return item.id === arr1[0].value;
          })
          this.deepCurrent = currentUnCheckedNode[0] ? currentUnCheckedNode[0].deep : undefined;
          //根据当前勾选的层级，找到所有相同的层级
          this.struNodeList.forEach(item => {
            if (item.deep == this.deepCurrent) checkList.push(item);
          });
          checkList.forEach(item => {
            let ids = {
              lable: item.name,
              value: item.id,
            }
            checkIds.push(ids);
          });
          //把找到相同数据的层级从勾选的数据中删除
          const result = this.searchParams.struId.filter((itemA) => {
            return !checkIds.some((itemB) => itemA.value == itemB.value);
          })
          this.searchParams.struId = result;
          this.currentChecked = result;
        }
      } else {
        this.searchParams.struId = value;
      }
      this.checkedEvet = false;
    },
    /**
     * 表格点击分页中数字触发的方法
     * @param pagination
     */
    tableChange(pagination) {
      this.pagination.current = pagination.current;
      this.pagination.pageSize = pagination.pageSize;
      this.searchParams.pageCurrent = pagination.current;
      this.list();
    },
    /**
     * 获取第二语言
     */
    getLanguageList() {
      let _that = this;
      _that.secondLanguages = true;
      let data = {};
      Object.assign(data, { fmeaId: _that.$store.getters.rfmeaId });
      data.rdfmFmeaTableDisplayCtrl = {
        effectDisplayOption: _that.effectDisplayOption
          ? _that.effectDisplayOption
          : "3",
        causeDisplayOption: _that.causeDisplayOption
          ? _that.causeDisplayOption
          : "1"
      };
      _that.$api
        .getFmeaTable(data)
        .then(res => {
          if (res.flag) {
            _that.searchParams.twoLanguage = res.data.display_nls;
            _that.secondLanguages = res.data.rfmcurrentNls || [];
          } else {
            _that.$message.error(res.message, 1);
          }
        })
        .catch(error => {
          _that.$message.error(error.response.data.message, 1);
        })
        .finally(() => {
          _that.secondLanguageLoading = false;
        });
    },
  }
};
</script>

<style lang="less" scoped>
/** 表格头部自动换行 */
/deep/ .ant-table-thead {
  .ant-table-row-cell-ellipsis .ant-table-column-title {
    white-space: normal;
  }
}

/deep/ .radio-group-class {
  float: right;
  margin-top: -32px;
}

/deep/ .ant-table-tbody {
  .ant-table-row-cell-ellipsis:nth-of-type(2) {
    text-align: left !important;
  }

  .ant-table-row-cell-ellipsis:nth-of-type(3) {
    text-align: left !important;
  }

  .ant-table-row-cell-ellipsis:nth-of-type(4) {
    text-align: left !important;
  }

  .ant-table-row-cell-ellipsis:nth-of-type(5) {
    text-align: left !important;
  }

  .ant-table-row-cell-ellipsis:nth-of-type(6) {
    text-align: left !important;
  }

  .ant-table-row-cell-ellipsis:nth-of-type(7) {
    text-align: left !important;
  }

  .ant-table-row-cell-ellipsis:nth-of-type(8) {
    text-align: left !important;
  }

  .ant-table-row-cell-ellipsis:nth-of-type(9) {
    text-align: left !important;
  }

  .ant-table-row-cell-ellipsis:nth-of-type(10) {
    text-align: left !important;
  }

  .ant-table-row-cell-ellipsis:nth-of-type(11) {
    text-align: left !important;
  }

  .ant-table-row-cell-ellipsis:nth-of-type(12) {
    text-align: left !important;
  }

  .ant-table-row-cell-ellipsis:nth-of-type(13) {
    text-align: left !important;
  }

  .ant-table-row-cell-ellipsis:nth-of-type(14) {
    text-align: left !important;
  }

  .ant-table-row-cell-ellipsis:nth-of-type(15) {
    text-align: left !important;
  }

  .ant-table-row-cell-ellipsis:nth-of-type(16) {
    text-align: left !important;
  }

  .ant-table-row-cell-ellipsis:nth-of-type(17) {
    text-align: left !important;
  }
}

div {
  overflow: hidden; // 溢出隐藏
  text-overflow: ellipsis;
}

.page {
  height: calc(80vh);
  overflow: auto;
}

/*/deep/ .ant-table-fixed-header > .ant-table-content > .ant-table-scroll > .ant-table-body {
  overflow-y: auto !important;
}*/
</style>
