<template>
  <div class="height_100">
    <div class="height_100" v-DivHeight="getDivHeight">
      <el-table :data="tableData" border style="width: 100%" header-row-class-name="custom-table-header"
      @sort-change="sortChange" v-if="showTable" :maxHeight="tableHeight" v-el-table-infinite-scroll="getList" :infinite-scroll-distance="10" 
    :infinite-scroll-disabled="disabled"
        >
        <el-table-column label="#" width="60" type="index" align="center">
          <template slot-scope="scope">
            <span>{{ (scope.$index + 1) + ((queryParams.current - 1) * queryParams.size) }}</span>
          </template>
        </el-table-column>

        <el-table-column v-for="item in column.filter(item=>!item.ifHidden)" :key="item.value" :prop="item.value" :render-header=" $commonJS.renderHeaderMethods" :label="item.name" sortable="custom" align="center">
          <template slot-scope="scope">
            <div v-if="['name'].includes(item.value)">
              <el-link type="primary" @click="handleItem(scope.row,item.value)">
                <span  v-html="$commonJS.getColumnData(scope.row,item)"></span>
              </el-link>
            </div>
            <div v-else-if="['signPatentNo'].includes(item.value)">
              <el-link type="primary" @click="$commonJS.checkPatentDetails(scope.row.signPatentNo,scope.row.id)">
                <span  v-html="$commonJS.getColumnData(scope.row,item)"></span>
              </el-link>
            </div>
            <div v-else-if="['eventNames','cronNames'].includes(item.value)" v-html="$commonJS.getColumnData(scope.row,item)"></div>
            <div v-else v-html="$commonJS.getColumnData(scope.row,item)"></div>
          </template>
        </el-table-column>

        <el-table-column v-if="[1].indexOf(isOperate) == -1" label="操作" align="center" width="150px">
        <template slot-scope="scope">
          <el-dropdown @command="handleCommand($event, scope.row)" split-button type="primary" size="small"  @click="handleCommand('e',scope.row)">
            <span v-if="$reportPermission(scope.row.id,[0,1])">编辑</span>
            <span v-else>查看</span>
            <el-dropdown-menu slot="dropdown" class="text-align_center">
              <el-dropdown-item command="0" v-if="$reportPermission(scope.row.id,[0,1])">分享</el-dropdown-item>
              <el-dropdown-item command="1" v-if="[2,3].includes(scope.row.status) && $reportPermission(scope.row.id,[0,1])">导出报告</el-dropdown-item>
              <el-dropdown-item command="2" v-if="[2,3].includes(scope.row.status) && $reportPermission(scope.row.id,[0,1])">报告文档</el-dropdown-item>
              <el-dropdown-item command="3" v-if="[2].includes(scope.row.status)&&[0,1,2,3].includes(scope.row.reportType) && $reportPermission(scope.row.id,[0,1])">自定义字段</el-dropdown-item>
              <el-dropdown-item command="5" v-if="[2].includes(scope.row.status) && [0,1,2].includes(scope.row.reportType) && $reportPermission(scope.row.id,[0,1])">拆分特征</el-dropdown-item>
              <el-dropdown-item command="15" v-if="[2].includes(scope.row.status) && [3,4].includes(scope.row.reportType) && $reportPermission(scope.row.id,[0,1])">产品信息录入</el-dropdown-item>
              <el-dropdown-item command="8" v-if="(scope.row.reportType == 4 && [2].includes(scope.row.status)) && $reportPermission(scope.row.id,[0,1])">专利与产品关联比对</el-dropdown-item>
              <el-dropdown-item command="9" v-if="(scope.row.reportType == 5 && [2].includes(scope.row.status)) && $reportPermission(scope.row.id,[0,1])"> 规避方案填写</el-dropdown-item>
              <el-dropdown-item command="10" v-if="[3].includes(scope.row.reportType)&&[2,3].includes(scope.row.status) && $reportPermission(scope.row.id,[0,1])"> 相关对比文件</el-dropdown-item>
              <el-dropdown-item command="11" v-if="[2].includes(scope.row.status) && $reportPermission(scope.row.id,[0,1])"> 完成报告</el-dropdown-item>
              <el-dropdown-item command="12" v-if="[3].includes(scope.row.status) && $reportPermission(scope.row.id,[0,1])">添加追踪报告</el-dropdown-item>
              <!-- <el-dropdown-item command="13" v-if="(scope.row.reportType == 7 && [2,3].includes(scope.row.status)) && $reportPermission(scope.row.id,[0,1])">添加无效理由和证据</el-dropdown-item> -->
              <el-dropdown-item command="14" v-if="(scope.row.reportType == 7 && [2,3].includes(scope.row.status)) && $reportPermission(scope.row.id,[0,1])">证据文献</el-dropdown-item>
              <el-dropdown-item command="7" divided style="color: red;" v-if=" $reportPermission(scope.row.id,[0,1])">删除 </el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </template>
      </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
import { getTableHeight } from '@/views/components/mixins'
import mixins from '../mixins';
export default {
  mixins:[mixins,getTableHeight],
  props: {
    isOperate: {//控制显示
      type: [String,Number],
      default:''
    },
   
    column: {//显示栏位管理数组
      type: Array,
      default: () => {
        return [
          
        ]
      }
    },
    row: null,
    //操作信息
    handleMessage:''
  },
  data() {
    return {
      // 报告类型
      reportTypeName: {
        '0':'无效分析报告',
        '1':'第三方意见报告',
        '2':'稳定性分析报告',
        '3':'FTO调查报告',
        '4':'侵权分析报告',
        '5':'回避设计报告',
        '7':'无效应对报告',
      },
      // 报告状态
      statusName: {
        0:'开卷审核',
        1:'创建中',
        2:'处理中',
        3:'完成',
        4:'取消开卷',
        5:'补资料中',
      },
       //正在努力加载中
       isFlag: false,
      //没有更多啦！
      isMore: false,
      //禁用懒加载
      disabled: true,
      params: {
        size: 5,
        current: 0
      },
      // 排序数组
      sort: [
        {
          "orderBy": "createTime",
          "orderType": 1
        }
      ],
      //事件类型及所选
      action:{
        type:'',//1表示删除，2表示其他，3表示新增
        id:''
      }
    };
  },
  watch: {
    handleMessage(val){
      if(val){
        this.updateData()
      }
    }
  },
  mounted() {
    if (!this.row) {
      this.disabled = true
    } else {
      this.disabled = false
    }
  },
  methods: {
     //更新数据
    updateData() {
      if(this.action.type == 1){
        if(this.tableData.length == 1){
          return false
        }
        var startIndex = this.tableData.findIndex(item=>{
              return item.id == this.action.id
          })
          this.tableData.splice(startIndex,1)
        let params = {
          ...this.params,
          searchQuery : this.$commonJS.objectToString(this.row.searchOption),//检索条件
          orderDTOList: this.sort,//排序
          groupField: this.row.groupBy,
          groupFieldValue: this.row.row.value,
        }
        this.getList2(params,1)
      }else if(this.action.type == 2){
        let params = {
          ...this.params,
          searchQuery:`id=${this.action.id}`,//检索条件
          groupField: this.row.groupBy,
          groupFieldValue: this.row.row.value,
        }
        this.getList2(params,2)
      }
    },

    getList2(params,type){
      this.$api.queryReportProject(params).then(res => {
        if (res.code == 200) {
          if(type == 1){
            var startIndex = (params.current-1)*size
            var endIndex = this.tableData.length
            var len = endIndex - startIndex
            this.tableData.splice(startIndex,len,...res.data.data)
            this.params.total = res.data.total
          }else if(type == 2){
            var startIndex = this.tableData.findIndex(item=>{
              return item.id == this.action.id
            })
            this.tableData.splice(startIndex,1,...res.data.data)
          }
          
        }
      }).catch(err => {
      })
    },


    getList() {
      if (!this.row) return;
      if (this.disabled) return;
      if (this.params.current * this.params.size >= this.params.total) {
        this.isMore = true
        this.disabled = true
        setTimeout(() => {
          this.isMore = false;
          this.isFlag = false
        }, 1000)
      }
      this.params.current += 1
      let params = {
        ...this.params,
        searchQuery : this.$commonJS.objectToString(this.row.searchOption),//检索条件
        orderDTOList: this.sort,//排序
        groupField: this.row.groupBy,
        groupFieldValue: this.row.row.value,
      }
      this.isMore = false;
      this.isFlag = true;
      this.$api.queryReportProject(params).then(res => {
        if (res.code == 200) {
          this.tableData.push(...res.data.data)
          this.params.total = res.data.total
        }
      }).catch(err => {
      })
      setTimeout(() => {
        this.isMore = false;
        this.isFlag = false
      }, 1000)
    },

    // 排序
    sortChange({ column, prop, order }) {
      this.handleSort({ column, prop, order })
      if (!this.row) {
        this.$emit('on-sort', { column, prop, order })
      }
    },
    // 排序方法
    handleSort({ column, prop, order }) {
      //如需要多个字段排序，则不需要清空
      var params = {
        sort:this.sort,
        column,
        prop,
        order,
      }
      this.sort = this.$commonJS.getSortData(params)
      this.params.current = 0
      this.disabled = false
      this.tableData.splice(0)
      this.getList()
    },
  },
};
</script>
<style lang="scss">

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