<template>
  <div style="padding:20px">
   
    <div style="display: flex;justify-content: center;margin-bottom: 10px;">
      <el-select placeholder="请选择显示类型" v-model="Type" style="" @change="TypeSelect($event)">
            <el-option label="仅显示主权要" value="1"></el-option>
            <el-option label="全部显示" value="0"></el-option>
      </el-select>
    </div>
   
    <!-- <el-button @click="taskWork" type="primary" size="small" style="float: right;margin-bottom: 10px;">协同办公</el-button> -->
    <template>
      <el-table :data="tableData" border ref="table" :span-method="objectSpanMethod" v-loading="loading"
        style="width: 100%" :height="tableHeight">
        <el-table-column prop="pRightName" label="权要" width="180" align="center">
          <template slot-scope="scope">
            <el-tooltip class="item" effect="dark" :content="scope.row.pContent" placement="top">
              <span>{{ scope.row.pRightName }}</span>
            </el-tooltip>
          </template>
        </el-table-column>
        <el-table-column prop="content" label="特征" width="300" align="center">
          <template slot-scope="scope">
            <p> {{ scope.row.content.trim() }}</p>
           
          </template>
        </el-table-column>
        <el-table-column prop="explainText" label="解释" align="center">
          <template slot-scope="scope">
            <p style="width:100%;outline: #dcdfe6;" 
                  v-html="scope.row.explainText" >
            </p>
            
          </template>
        </el-table-column>
        <el-table-column prop="littleDirection" label="回避设计方向" align="center">
          <template slot-scope="scope">
             <p style="width:100%;outline: #dcdfe6;" 
                    v-html="scope.row.littleDirection" >
            </p>
           
          </template>
        </el-table-column>
      </el-table>
    </template>
    <div style="margin-top: 20px;">
      <p>回避设计总体方向：</p>
      <div>
        <div style="min-height:60px;outline: #dcdfe6;border:1px solid #DCDFE6;border-radius:5px;padding: 10px;"> 
          <p style="width:100%;outline: #dcdfe6;" 
            v-html="textarea1.wholeDirection" >
          </p>
        </div>
      </div>

    </div>
    <sendCollaboration :visibleCollaborations="visibleWork" @collaboration="collaboration" :reportId="reportId"  :reportType="row.type" :patentNo1="row.signPatentNo" :choiceFormS="choiceFormS"  :selected="selected"></sendCollaboration>
  </div>
</template>

<script>
import { explain } from '@/views/report/components/mixins'
import { PatentDetails } from '@/views/workspace/folder/components/mixins';
import sendCollaboration from "@/views/report/components/sendCollaboration.vue"
export default {
  props: ['patentNo', 'reportId', 'splitBy', 'splitType','row'],
  mixins: [explain, PatentDetails],
  components: {
    sendCollaboration,
  },
  data() {
    return {
      tableData: [],
      tableData1: [],
      checkList: [],
      splitType1: "0",//拆分类型0仅拆主权要，1全部拆分
      splitBy1: "2",
      Type: "0",
      textarea1: {},
      mergeArr: ['id', 'pRightName'],
      mergeObj: {},
      typeArr: [1],//显示权要还是全部显示
      loading: false,
      rows: [],
      Index_row: [],
      isNum: 1,
      isTypeBy: 0,
      tableHeight: null,
      visibleWork: false,
      choiceFormS: {},
      selected: [],
    };
  },
  watch: {
    tableData() {
      this.$nextTick(() => {
        this.setHeight()
      })
    },
  },
  mounted() {
   
    this.getSplitMessage()
  },
  methods: {
    setHeight() {
      const offsetTop = window.innerHeight - this.$refs.table.$el.offsetTop - 40
      this.height = offsetTop
      const body = document.querySelector('.el-table__body')
      if (!body) {
        return false
      }
      const offsetBodyHeight = body.offsetHeight
      //console.log( window.innerHeight,body,offsetBodyHeight,offsetTop)
      if (this.tableData.length && offsetBodyHeight < offsetTop) {
        this.tableHeight = offsetBodyHeight + 75
      } else if (!this.tableData.length) {
        this.tableHeight = null
      } else {
        this.tableHeight = offsetTop
      }
      this.tableHeight = this.tableHeight > 200 ? this.tableHeight : 200
    },
  
    getSplitMessage() {
      let a = {
        taskId: null,
        patentNo: null,
        reportId: this.reportId,
      }
      this.$api.getSplitMessage(a).then(res => {
        if (res.code == 200) {
          if (JSON.stringify(res.data) == '{}') {
            this.isNum = 1
          } else {
            this.isNum = 0
          }
          this.splitPatentRight()
        }
      })
    },
    //初始拆分
    splitPatentRight() {
      this.loading = true
      this.tableData1 = []
      var PatentRight = {
        patentNo: this.patentNo,
        splitType: this.splitType1,
        splitBy: this.splitBy1,
        ReportId: this.reportId,
      }
      var PatentReportId = {
        patentNo: this.patentNo,
        reportId: this.reportId,
        // splitType: this.splitType,
        // splitBy: this.splitBy,
      }
      if (this.isNum == 0 && this.isTypeBy == 0) {
        this.$api.getAvoidDesignDirection(PatentReportId).then(res => {
          if (res.code == 200) {
            this.textarea1.wholeDirection = res.data.wholeDirection
            if (res.data.rights.length > 0) {
              res.data.rights.forEach(rightsiItem => {
                if (rightsiItem.features.length > 0) {
                  rightsiItem.features.forEach(featuresItem => {
                    featuresItem.pRightName = featuresItem.rightName
                    featuresItem.pContentOut = rightsiItem.contentOut
                    featuresItem.pContent = rightsiItem.content
                    featuresItem.pSort = rightsiItem.sort
                    featuresItem.pType = featuresItem.rightType
                    this.splitBy1 = featuresItem.splitBy.toString()
                    this.splitType1 = featuresItem.splitType.toString()
                    this.hasOwn(featuresItem)
                    this.tableData1.push(featuresItem)
                  })
                }
              })
            }
            this.TypeSelect(this.Type)
            this.loading = false
          }

        }).catch(error=>{
          this.loading = false
        })
      } else {
        this.$api.splitPatentRight(PatentRight).then(res => {
          if (res.code == 200) {
            let a = this.$s.getSession('reportMessage1')
            a.splitBy = res.data.splitBy.toString()
            a.splitType = res.data.splitType.toString()
            this.$s.setSession('reportMessage1', a)
            if (res.data.patentRightVos.length > 0) {
              res.data.patentRightVos.forEach(RightVosItem => {
                if (RightVosItem.features.length > 0) {
                  RightVosItem.features.forEach(FeaturesItem => {
                    FeaturesItem.pRightName = RightVosItem.RightName
                    FeaturesItem.pSignPatentNo = RightVosItem.signPatentNo
                    FeaturesItem.pContentOut = RightVosItem.contentOut
                    FeaturesItem.pContent = RightVosItem.content
                    FeaturesItem.pReportId = RightVosItem.reportId
                    FeaturesItem.pPatentId = RightVosItem.patentId
                    FeaturesItem.pType = RightVosItem.type
                    FeaturesItem.pSort = RightVosItem.sort
                    this.hasOwn(FeaturesItem)
                    this.tableData1.push(FeaturesItem)
                  })
                }
              })
            }

            this.TypeSelect(this.Type)
            this.loading = false
          }
        }).catch(error=>{
          this.loading = false
        })
      }


    },

    hasOwn(item) {
      if (!item.hasOwnProperty("explainText")) {
        item.explainText = item.contentOut
      } else {
        if (item.explainText == "") {
          item.explainText = item.contentOut
        }
      }
      if (!item.hasOwnProperty("littleDirection")) {
        item.littleDirection = ''
      } else {
        if (item.littleDirection == "") {
          item.littleDirection = ''
        }
      }
    },
    // 选择下拉框
    // splitTypeSelect(even) {
    //   this.splitType1 = even
    //   this.isTypeBy = 1
    //   this.splitPatentRight()
    // },
    // splitBySelect(even) {
    //   this.splitBy1 = even
    //   this.isTypeBy = 1
    //   this.splitPatentRight()
    // },
    TypeSelect(even) {
      this.typeArr = []
      if (even == 1) {
        this.typeArr.push(1)
      } else {
        this.typeArr.push(1, 0)
      }
      this.tableData = this.tableData1.filter(item => {
        return this.typeArr.includes(item.pType)
      })
      this.getSpanArr(this.tableData)
      // this.keep()
    },
    //获取每个元素所需合并的行数
    getSpanArr(data) {
      this.rows = []
      this.mergeArr.forEach((key, index1) => {
        let count = 0;
        this.mergeObj[key] = [];
        data.forEach((item, index) => {
          if (index === 0) {
            this.mergeObj[key].push(1);
          } else {
            if (item[key] === data[index - 1][key] && item[key] !== 'explainText') {
              this.mergeObj[key][count] += 1;
              this.mergeObj[key].push(0);
            } else {
              count = index;
              this.mergeObj[key].push(1);
            }
          }
        })
      })
    },
    // 合并行
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (this.mergeArr.indexOf(column.property) !== -1) {
        if (this.mergeObj[column.property][rowIndex]) {
          // console.log("@@",this.mergeObj[column.property][rowIndex]);
          return [this.mergeObj[column.property][rowIndex], 1]
        } else {
          return [0, 0];
        }
      }
      // if (columnIndex === 0) {
      //   if (rowIndex % 2 === 0) {
      //     return {
      //       rowspan: 2,
      //       colspan: 1
      //     };
      //   } else {
      //     return {
      //       rowspan: 0,
      //       colspan: 0
      //     };
      //   }
      // }
    },
        // 工作协同
    taskWork() {
        this.visibleWork = true//协同办公框打开
    },
    collaboration(val) {
      this.visibleWork = val
    },
    //保存
    // keep() {
    //   // console.log(this.tableData1);
    //   let keepArr = [
    //     {
    //       pRightName: this.tableData1[0].pRightName,
    //       RightName: this.tableData1[0].pRightName,
    //       signPatentNo: this.tableData1[0].pSignPatentNo,
    //       // patentId: this.tableData1[0].pPatentId,
    //       content: this.tableData1[0].content,
    //       // type: this.tableData1[0].pType,
    //       // sort: this.tableData1[0].pSort,
    //       rightId: this.tableData1[0].rightId,
    //       reportId: this.tableData1[0].pReportId,
    //       contentOut: this.tableData1[0].pContentOut,
    //       features: [],
    //     }
    //   ]
    //   var j = 0
    //   for (let i = 0; i < this.tableData1.length; i++) {
    //     // console.log(this.tableData1);
    //     if (keepArr.findIndex(item => { return (item.pRightName || item.RightName) == this.tableData1[i].rightName }) < 0) {
    //       // console.log(this.tableData1[i]);
    //       j += 1
    //       keepArr.push(
    //         {
    //           RightName: this.tableData1[i].pRightName,
    //           signPatentNo: this.tableData1[i].pSignPatentNo,
    //           // patentId: this.tableData1[i].pPatentId,
    //           content: this.tableData1[i].pContent,
    //           // type: this.tableData1[i].pType,
    //           // sort: this.tableData1[i].pSort,
    //           rightId: this.tableData1[i].rightId,
    //           reportId: this.tableData1[i].pReportId,
    //           contentOut: this.tableData1[i].pContentOut,
    //           features: [],
    //         }
    //       )
    //     }
    //     // let featuresArr = ["signPatentNo", "patentId", "content","type","littleDirection","explainText","contentOut","splitBy","splitType","featuresOrder","id","rightName","isFinal"]
    //     // featuresArr.forEach(item1 => {
    //     //   var keepArrIndex = keepArr[j].features.findIndex(item2 => {
    //     //   // console.log(item2,item1);
    //     //     return item2.hasOwnProperty(item1)
    //     //   })
    //     //   console.log(keepArrIndex);
    //     //   if (keepArrIndex < 0) {
    //     //     console.log(item1,keepArr[j].features);
    //     //     keepArr[j].features.push({
    //     //       item1:this.tableData1[i].item1,
    //     //     })

    //     //   }
    //     // })
    //     keepArr[j].features.push({
    //       signPatentNo: this.tableData1[i].signPatentNo,
    //       patentId: this.tableData1[i].patentId,
    //       content: this.tableData1[i].content,
    //       type: this.tableData1[i].type,
    //       littleDirection: this.tableData1[i].littleDirection ? this.tableData1[i].littleDirection : '',
    //       // littleDirection:
    //       // reportId: this.tableData1[i].pReportId,
    //       reportId: this.tableData1[i].reportId,
    //       explainText: this.tableData1[i].explainText ? this.tableData1[i].explainText : '',
    //       contentOut: this.tableData1[i].contentOut,
    //       splitBy: this.tableData1[i].splitBy,
    //       splitType: this.tableData1[i].splitType,
    //       featuresOrder: this.tableData1[i].featuresOrder,
    //       partnerId: this.tableData1[i].partnerId,
    //       rightId: this.tableData1[i].rightId,
    //       rightType: this.tableData1[i].rightType,
    //       id: this.tableData1[i].id,
    //       rightName: this.tableData1[i].rightName,
    //       pRightName: this.tableData1[i].rightName,
    //       isFinal: this.tableData1[i].isFinal,
    //       pContent: this.tableData1[i].pContent,
    //       pContentOut: this.tableData1[i].pContentOut,
    //     })
    //     // console.log(this.tableData1[i].littleDirection);
    //   }
    //   let keepStr = {
    //     reportId: this.reportId,
    //     avoidDesignLittleDirectionDTOs: keepArr,
    //     wholeDirection: this.textarea1.wholeDirection ? this.textarea1.wholeDirection : ''
    //   }
    //   // console.log(this.textarea1.wholeDirection);
    //   this.$api.addAvoidDesignDirection(keepStr).then(res => {
    //     if (res.code == 200) {
    //       // if (this.isNum!=0) {
    //       //   
    //       // } 
    //       this.$message.success("保存成功")
    //     }
    //   })
    // },
    // 获取选中特征信息
    // getRow(scope) {
    //   // console.log(scope);

    //   let Index = this.row.findIndex(item => { return item.id == scope.row.id })
    //   if (Index < 0) {
    //     // this.Index_row.push(scope.$index)
    //     scope.row.$index = scope.$index
    //     this.row.push(scope.row)
    //   } else {
    //     this.row.splice(Index, 1)
    //     // this.Index_row.splice(Index, 1)
    //   }
    //   // console.log(this.row);
    // },
    // 特征等合并
    // merge() {
    //   // console.log(this.checkList,this.row);
    //   if (this.row.length > 1) {
    //     var str = ''
    //     var str1 = ''
    //     var str2 = ''
    //     var str3 = ''
    //     for (let i = 0; i < this.row.length - 1; i++) {
    //       if (this.row[i].pSort != this.row[i + 1].pSort) {
    //         this.$alert("不能跨权要合并特征", "提示", {
    //           confirmButtonText: '确定',
    //         })
    //         return false
    //       } else {
    //         let Index_rowArr = this.row.sort((a, b) => {
    //           return a.$index - b.$index
    //         })
    //         // console.log(this.Index_row,Index_rowArr);
    //         if (Index_rowArr[i + 1].$index - Index_rowArr[i].$index != 1) {
    //           this.$alert("非相邻不能合并特征", "提示", {
    //             confirmButtonText: '确定',
    //           })
    //           return false
    //         }
    //       }
    //     }
    //     this.row.forEach((rowItem, rowIndex) => {
    //       // console.log(rowItem,rowIndex);
    //       if (rowIndex < this.row.length - 1) {
    //         str = str + rowItem.content
    //         str1 = str1 + rowItem.contentOut
    //         str2 = str2 + rowItem.littleDirection
    //         str3 = str3 + rowItem.explainText
    //         let Index1 = this.tableData1.findIndex(item => { return rowItem.id == item.id })
    //         if (Index1 != -1) {
    //           this.tableData1.splice(Index1, 1)
    //         }
    //         // console.log(Index1, this.tableData1);
    //       } else if (rowIndex == this.row.length - 1) {
    //         str = str + rowItem.content
    //         str1 = str1 + rowItem.contentOut
    //         str2 = str2 + rowItem.littleDirection
    //         str3 = str3 + rowItem.explainText
    //       }
    //       let Index2 = this.tableData1.findIndex(item => { return item.id == rowItem.id })
    //       if (Index2 != -1) {
    //         this.tableData1[Index2].content = str
    //         this.tableData1[Index2].contentOut = str1
    //         this.tableData1[Index2].littleDirection = str2
    //         this.tableData1[Index2].explainText = str3
    //       }
    //       // console.log(this.tableData1[Index2]);

    //     })
    //     this.TypeSelect(this.Type)
    //     this.row = []
    //     this.checkList = []
    //   }
    // },
    // 拆分
    // split() {
    //   //不能同时拆分
    //   if (this.row.length > 0) {
    //     if (this.row.length > 1) {
    //       this.$alert("不能同时拆分多个特征", "提示", {
    //         confirmButtonText: '确定',
    //       })
    //       return false
    //     }
    //     var rowId = Math.floor((Math.random() * 9999) + 1000);
    //     this.row.forEach((rowItem, rowIndex) => {
    //       var splitAdd = {
    //         id: rowItem.id + rowId + "a",
    //         content: '',
    //         contentOut: '',
    //         littleDirection: '',
    //         explainText: '',
    //         rightName: rowItem.rightName,
    //         featuresOrder: rowItem.featuresOrder,
    //         splitBy: rowItem.splitBy,
    //         splitType: rowItem.splitType,
    //         signPatentNo: rowItem.signPatentNo,
    //         rightId: rowItem.rightId,
    //         rightType: rowItem.rightType,
    //         isFinal: rowItem.isFinal,
    //         partnerId: rowItem.partnerId,
    //         reportId: rowItem.reportId,

    //         pRightName: rowItem.pRightName,
    //         pSignPatentNo: rowItem.pSignPatentNo,
    //         pContentOut: rowItem.pContentOut,
    //         pContent: rowItem.pContent,
    //         pReportId: rowItem.pReportId,
    //         pPatentId: rowItem.pPatentId,
    //         pType: rowItem.pType,
    //         pSort: rowItem.pSort,

    //       }
    //       let Index2 = this.tableData1.findIndex(item => { return rowItem.id == item.id })
    //       this.tableData1.splice(Index2 + 1, 0, splitAdd)
    //     })
    //     this.TypeSelect(this.Type)
    //     this.row = []
    //     this.checkList = []
    //   }
    // },
  }
}
</script>

<style lang="scss" scoped></style>