<template>
    <div>
        <div style="display:flex;justify-content: flex-end;padding-bottom:20px">
            <!-- <el-button type="info" style="height:32px">
              <img src="../../../../../assets/img/filtrationSearch.png" alt="" style="width:20px">筛选 
            </el-button> -->
          
              <div class="btn1" @click="sift" style="width:80px;height:32px;display:flex;justify-content:space-around;border-radius:5px; cursor: pointer;margin-right: 10px; background-color: #909399;">
                <img src="@/assets/img/filtrationSearch.png" alt="" style="width:16px;height:16px;margin-top:9px;margin-left:8px"><p style="margin:0 8px 0 0;line-height:32px;color:white;font-size:14px">筛选 </p> 
                
              </div>
              <el-button type="primary" size="small" style="margin-right: 20px;" @click="choicePage">本页选择</el-button>
              <!-- <el-popover placement="bottom" title="" width="250" trigger="click">
                      <el-main class="patent-fast-edit-popover">
                            <div class="btn" @click="handleSelectNumber(0)">本页选择</div>
                            <div class="btn" @click="handleSelectNumber(1)">全部选择</div>
                            <el-divider></el-divider>
                    <div class="select-number">
                              <span>从</span>
                              <el-input size="mini" v-model="queryParams.startNumber"></el-input>
                              <span>到</span>
                              <el-input size="mini" v-model="queryParams.endNumber"></el-input>
                              <el-button type="text" size="" @click="handleSelectNumber(2)">确定</el-button>
                    </div>
                  </el-main>
                  <el-button type="info" size="small" class="margin-left_10" slot="reference">
                      选择专利<i class="el-icon-arrow-down el-icon--right"></i>
                   </el-button>
                </el-popover>-->
                <el-button type="text" size="small" class="margin-left_10" @click="handleCancelSelectNumber">取消选择</el-button>  
            </div>
         
          <el-table
            :data="tableData"
            border
            :row-key="getRowKeys"
            v-loading="loading"
            style="min-width: 100%; overflow:auto">
            <el-table-column width="80" align="center">
              <template slot-scope="scope">
                <div>
                  <el-checkbox-group v-model="selected" style="display:inline-block">
                    <el-checkbox :label="scope.row.patentNo" :disabled="scope.row.disabled" @change="getFunInfo(scope.row.patentNo)">
                      <span>{{ (scope.$index + 1) + ((queryParams.current - 1) * queryParams.size) }}</span>
                    </el-checkbox>
                </el-checkbox-group>
                </div>
              </template>
            </el-table-column>
              <el-table-column
                prop="patentNo"
                label="专利号"
                align="center"
                width="200px">
                <template slot-scope="scope">
                  <div>
                    <el-link type="primary"  @click="toPatentDetails(scope.row.patentNo)">{{scope.row.patentNo}}</el-link>
                  </div>
                <!-- <el-checkbox-group v-model="checkList" style="display:inline-block">
                    <el-checkbox :label="scope.row.patentNo" @change="getFunInfo(scope.row.patentNo)">
                          {{scope.row.patentNo}}
                    </el-checkbox>
                </el-checkbox-group> -->
                </template>
              </el-table-column>
            <!-- <el-table-column
              prop="patentNo"
              label="专利号"
              align="center"
              width="200px">
              <template slot-scope="scope">
                <el-checkbox-group v-model="selected" style="display:inline-block">
                    <el-checkbox :label="scope.row.patentNo" :disabled="scope.row.disabled" @change="getFunInfo(scope.row.patentNo)">
                          {{scope.row.patentNo}}
                    </el-checkbox>
                </el-checkbox-group>
              </template>
            </el-table-column> -->
            <el-table-column
              prop="name"
              label="专利标题"
              align="center"
              width="300px">
            </el-table-column>
            <el-table-column
              prop="simpleStatus"
              align="center"
              label="状态">
            </el-table-column>
          </el-table>
          

    <el-dialog title="筛选" :visible.sync="visible" width="1000px" max-height="600" :before-close="close" append-to-body>
      <div style="height: 500px">
        <el-form ref="form" :model="form" label-width="80px" label-position="left">
          <el-form-item label="标题">
            <el-input type="textarea" v-model="form.patentName" placeholder="请输入查询内容"></el-input>
          </el-form-item>
          <el-form-item label="摘要">
            <el-input type="textarea" v-model="form.abstractStr" placeholder="请输入查询内容"></el-input>
          </el-form-item>
          <el-form-item label="专利号">
            <el-input type="textarea" v-model="form.patentNo" placeholder="请输入查询内容"></el-input>
          </el-form-item>
          <el-form-item label="申请号">
            <el-input type="textarea" v-model="form.applicationNo" placeholder="请输入查询内容"></el-input>
          </el-form-item>
          <el-form-item label="申请人">
            <el-input type="textarea" v-model="form.applicationName" placeholder="请输入查询内容"></el-input>
          </el-form-item>
          <el-form-item label="权利人">
            <el-input type="textarea" v-model="form.obligeeName" placeholder="请输入查询内容"></el-input>
          </el-form-item>
        </el-form>
        </div>
        <div slot="footer" class="dialog-footer">
          <el-button @click="close">取 消</el-button>
          <el-button type="primary" @click="screen">确 定</el-button>
        </div>
    </el-dialog>
    </div>
</template>

<script>
import { PatentDetails } from '@/views/components/common/mixins';
export default{
  props:['tableData','isSubmit','queryParams'],
  mixins:[PatentDetails],
  data() {
    return {
      loading:false,
      visible:false,
      form: {},
      // formS: {},
      // tableData:[],
      checkList:[],
      selected: [],
      formS:{},
    }
  },
  mounted() {
    
  },
  watch:{
    isSubmit(val){
      if(val){
        this.form = {}
        this.checkList=[]
        this.selected = []
      }
    }
  },
  methods: {
    // opens(data) {
    //   this.tableData=data
    // },
    handleCancelSelectNumber() {//取消选择
      this.checkList = []
      this.selected=[]
      this.$emit('PersonPatent',this.checkList)
      // this.getList()
    },
    getRowKeys(row) {
      return row.id
    },
    getFunInfo(patentNo){
      if (this.checkList.includes(patentNo)) {
        this.checkList.splice(
          this.checkList.indexOf(this.checkList.find(function (element) {
            return element === patentNo;
          }
          )
          ), 1);

      } else {
        this.checkList.push(patentNo)
      }
      this.$emit('PersonPatent',this.checkList)
    },
    sift() {
      this.visible = true
    },
    choicePage() {//本页选择
      let choice = this.tableData.map(item => item.patentNo);
      this.selected = [...new Set(this.selected.concat(choice))]
      this.checkList = [...new Set(this.checkList.concat(choice))]
      this.$emit('PersonPatent',this.checkList)
      // this.getList()
    },
    close() {//筛选取消
      this.visible = false
      this.form = this.formS
    },
    screen() {//筛选确定
      // for (let key in this.form) {
      //   this.queryParams[key]=this.form[key]
      // }
      // this.queryParams.patentName=this.form.patentName
      // this.getList()
      this.formS=JSON.parse(JSON.stringify(this.form))
      this.$emit("onForm", this.formS)
      this.visible = false
      // this.form = {}
    },
   
   
  },
}
</script>