<template>
  <!-- 对比文件2 -->
  <div style="padding:20px">
    <div style="display: flex; justify-content: space-between;">
      <div :style="{visibility: selectedTotal>0?'visible':'hidden'}" >
        已勾选 <b>{{ selectedTotal }}</b> 条
      </div>
      <div>
        <el-button type="primary" @click="checkSelected">查看已选择</el-button>
        <el-button type="primary" @click="savePatentList" >保存</el-button>
      </div>
    </div>
    <el-container>
      <el-main>
        <div style="display:flex;justify-content: flex-end;padding-bottom:20px">
          <el-button type="primary" size="small" style="margin-right:10px;width:70px" @click="importPatent(reportId)">导入</el-button>
          <div class="btn1" @click="sift" style="width:80px;height:32px;display:flex;justify-content:space-around;border-radius:5px; cursor: pointer;">
            <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-popover placement="bottom" title="" width="250" trigger="click">
            <el-main class="patent-fast-edit-popover" v-loading="selectNumberLoading">
              <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> 
          <!-- 自定义收缩栏 -->
          <el-tooltip class="item" effect="dark" :content="(showRight ? '隐藏' : '显示') + '右侧菜单'" placement="top" >
            <i :class="showRight ? 'el-icon-s-unfold' : 'el-icon-s-fold'" style="font-size: 25px;right: 10px; margin-left: 10px;margin-top: 5px;color: #2f2f2f; cursor: pointer" @click="showRight = !showRight"></i>
          </el-tooltip>
        </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="checkList" style="display:inline-block">
                    <el-checkbox :label="scope.row.patentNo" @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>
                </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>
            <div class="pagination">
              <el-pagination :current-page.sync="queryParams.current" :page-size="queryParams.size" :total="total" @current-change="handleCurrentChange" layout="total, prev, pager, next, jumper" background></el-pagination>
            </div>
    </el-main>
      <!-- 自定义栏位 -->
      <!-- <div class="patent-articles-content-left" :style="{ width: showRight ? 'calc(100% - 321px)' : 'calc(100% - 21px)' }"> -->
      <div class="patent-left" :style="{ width: showRight ? '280px' : '0px' }" >
        <ChoseList @onChange="onChangeList" :reportId="reportId" :patentNo="queryParams.patentNo" ></ChoseList>
      </div>
    <!-- </div> -->
  </el-container>
    <el-dialog title="筛选" :visible.sync="visible" width="1100px" max-height="800" :before-close="close">
      <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-item label="申请号">
            <el-input type="textarea" v-model="form.applicationNo" 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="sure">确 定</el-button>
        </div>
    </el-dialog>

    <el-dialog title="已选择对比文件" :visible.sync="visibleSelected" width="1100px" :before-close="close2">
      <Selected-Patent :loadPatent="loadPatent" :reportId="reportId" @save="getSave"></Selected-Patent>
      <div slot="footer" class="dialog-footer">
          <el-button @click="close2">关 闭</el-button>
        </div>
    </el-dialog>
  </div>
</template>
<script>
import SelectedPatent from '../../components/SelectedPatent.vue'
import ChoseList from '../../Invalid/InvalidPage/ChoseList.vue'
import { PatentDetails } from '@/views/components/common/mixins';
import { importPatent } from '../../components/mixins';
export default {
components:{
    SelectedPatent,
    ChoseList
},
mixins:[PatentDetails,importPatent],
  props: ['reportId',"ChosePatentSure"],
  data() {
    return {
      loadPatent:false,
      visibleSelected:false,
      selectedTotal:0,
      isFetch:true,
      quickSelect:false,//是否快速选择
      loading: true,
      visible: false,
      activeName: 'second',
      selected: [],
      checkList: [],//回显
      tableData: [],
      sameData: [],
      total: 0,
      form: {},
      formS:{},
      startNumber:1,
      endNumber:0,
      Params: {
        current: 1,
        size: 10,
      },
      queryParams: {
        state:0,
        isAdd:[],
        isDelete:[],
        folder: null,
        projectId: null,
        read: 'all',
        current: 1,
        size: 10,
        name: '',
        abstractStr: '',
        publicNo: '',
        applicationNo: '',
        rightContent: '',
        sort: {
          order: 'asc',
          prop: 'id'
        },
        field: [],
        tree: [],
        selected: [],
        startNumber: 1,
        endNumber: 0,
        family: 0,
        showPatent: "0",
        patentName: "",
        patentNo: "",
        filedOptions: [],
      },
      mergeArr: ['id', 'patentNo'],
      mergeObj: {},
      selectNumberLoading: false,
      showRight:false,
    }
  },
  created() {

  },
  mounted() {
    this.getList()
    console.log(this.selectedTotal)
  },
  methods: {
    // onChangeOne(val) {
    //   console.log(val);
    //   this.$api.getPatentListPAS()

    // },
    //子页面自定义字段值
    onChangeList({field,a}) {
      console.log(field,a);
      this.queryParams.field = field
      this.queryParams.projectId = a
      this.getListPro()
      
    },
    getListPro() {
      console.log("进来");
      this.tableData=[]
      this.$api.getPatentListPAS(this.queryParams).then(res => {
        this.tableData = res.data.records
        this.total=res.data.total
      })
    },
    getSave(val){
      if(val){
        this.getList()
      }

    },
    checkSelected(){
      this.loadPatent = !this.loadPatent
      this.visibleSelected = true
    },
    close2(){
      this.visibleSelected = false
      this.loadPatent = !this.loadPatent
    },
    sift() {
      this.visible = true
    },
    sure() {
      this.formS=JSON.parse(JSON.stringify(this.form))
      if (Object.keys(this.formS).length!=0) {
        for (let key in this.formS) {
          this.queryParams[key]=this.formS[key]
        }
        if (this.queryParams.projectId) {
          this.getListPro()
        } else {
          this.getList()
        }
        
      } else {
        if (this.queryParams.projectId) {
          this.getListPro()
        } else {
          this.getList()
        }
      }
      
      this.visible = false
      // this.form = {}
    },
    close() {
      this.visible = false
      this.form = this.formS
    },
    getSelectedTotal() {
      console.log(this.queryParams.isAdd,this.queryParams.isDelete);
      this.selectedTotal = Number(this.endNumber) - Number(this.startNumber) + 1 + Number(this.queryParams.isAdd.length) - Number(this.queryParams.isDelete.length)
    },
    Switch(type) {//选择...确定公用
      let params = { ...this.queryParams }
      if (params.field.length == 0) {
        params.field = params.tree
      }
      switch (type) {
        case 0:
          this.queryParams.selected = this.tableData.map(item => item.patentNo);
          this.checkList = [...new Set(this.checkList.concat(this.queryParams.selected))]
          this.selectedTotal = this.checkList.length
          this.queryParams.isAdd=JSON.parse(JSON.stringify(this.checkList))
          this.getList()

          break
        case 1:
          params.startNumber = 1;
          params.endNumber = this.total
          this.startNumber = 1
          this.endNumber = this.total
          // this.commonSwitch()
          // this.quickSelect = true
          // break
        case 2:
          // this.selectNumberLoading = true
          // this.$api.getComPatentNos(params).then(response => {
          //   console.log(response.data)
          //   this.queryParams.selected = response.data
          //   this.checkList = [...new Set(this.checkList.concat(this.queryParams.selected))]
          //   // this.checkList = this.queryParams.selected
          //   this.selectNumberLoading = false
          //   this.getList()
          // }).catch(error => {
          //   this.selectNumberLoading = false
          // })
          this.queryParams.isDelete = []
          this.queryParams.isAdd = []
          if(type == 2){
            this.startNumber = this.queryParams.startNumber
            this.endNumber = this.queryParams.endNumber
          }
          
          // this.checkList =JSON.parse(JSON.stringify(this.queryParams.selected)) 
          this.checkList=[]
          this.queryParams.isDelete = []
          this.queryParams.isAdd = []
          this.getList()
          this.commonSwitch()
          this.quickSelect = true
          
          break
      }
    },
    commonSwitch(){
      console.log(this.queryParams.startNumber,this.queryParams.endNumber)
            if(this.queryParams.size*this.queryParams.current>=this.queryParams.startNumber ){
              if(this.queryParams.size*this.queryParams.current>=this.queryParams.endNumber){
                if(this.queryParams.size*(this.queryParams.current-1)+1<=this.queryParams.startNumber){
                  var a = this.queryParams.startNumber-(this.queryParams.size*(this.queryParams.current-1)+1)
                  var b = this.queryParams.endNumber-(this.queryParams.size*(this.queryParams.current-1)+1)
                  console.log(a,b)
                  for(var y=a;y<=b;y++){
                    console.log(this.tableData[y])
                   this.toIsDelete(this.tableData[y].patentNo,y)

                  }
                }else{
                  var a = (this.queryParams.size*(this.queryParams.current-1)+1)-(this.queryParams.size*(this.queryParams.current-1)+1)
                  var b = this.queryParams.endNumber-(this.queryParams.size*(this.queryParams.current-1)+1)
                  for(var y=a;y<=b;y++){
                    this.toIsDelete(this.tableData[y].patentNo,y)

                  }
                }
              }else{
                if(this.queryParams.size*(this.queryParams.current-1)+1<=this.queryParams.startNumber){
                  var a = this.queryParams.startNumber-(this.queryParams.size*(this.queryParams.current-1)+1)
                  var b = this.queryParams.size*this.queryParams.current-(this.queryParams.size*(this.queryParams.current-1)+1)
                  for(var y=a;y<=b;y++){
                    this.toIsDelete(this.tableData[y].patentNo,y)

                  }
                }else{
                  var a = (this.queryParams.size*(this.queryParams.current-1)+1)-(this.queryParams.size*(this.queryParams.current-1)+1)
                  var b = this.queryParams.size*this.queryParams.current-(this.queryParams.size*(this.queryParams.current-1)+1)
                  for(var y=a;y<=b;y++){
                    this.toIsDelete(this.tableData[y].patentNo,y)
                    
                  }
                }
              }
            }
           this.checkList = [...new Set(this.checkList)]
           this.selected = this.checkList
           this.getSelectedTotal()
      // console.log(this.checkList)
          
    },
    toIsDelete(patentNo,y){
      var index2 = this.queryParams.isDelete.findIndex(i=>{
        return i==patentNo
      })
      if(index2!=-1){

      }else{
        this.checkList.push(this.tableData[y].patentNo)
      }
      var index = this.queryParams.selected.findIndex(item=>{
        return item == patentNo
      })
      if(index!=-1){
        var index3 = this.queryParams.isDelete.findIndex(m=>{
        return m==patentNo
      })
      if(index3!=-1){

      }else{
        this.queryParams.isDelete.push(this.queryParams.selected[index])
      }
       
      }

      
    },
    handleSelectNumber(type) {
      console.log(type);
      this.Switch(type)
    
    },

    handleCancelSelectNumber() {//取消选择
      this.queryParams.isAdd = []
      this.queryParams.isDelete = []
      this.startNumber = 1
      this.endNumber = 0
      this.queryParams.selected = []
      this.checkList = []
      this.quickSelect = false
      this.selectedTotal = 0
      this.getList()
    },
    handleClick(tab, event) {
      console.log(tab, event);
    },
    getFunInfo(val) {
      console.log(this.quickSelect);
      if(this.quickSelect){
        var index4 = this.queryParams.selected.findIndex(item=>{
            return item == val
          }) 
          if(index4!=-1){
            var a = {
              reportId:this.reportId,
              patentNo:val
            }
            this.$api.deleteCompareNo(a).then(response=>{
              if(response.code == 200){
                        // this.getList()
                 this.queryParams.selected.splice(index4,1)
              }
            })
          
         this.isFind(val)
       
      }else{
        this.isFind(val)
      }
      }else{
        var index = this.queryParams.selected.findIndex(item=>{
          return item == val
        }) 
        if(index!=-1){
          var a = {
            reportId:this.reportId,
            patentNo:val
          }
          this.$api.deleteCompareNo(a).then(response=>{
            if(response.code == 200){
              this.getList()
            }
          })
        }else{
          var index5 = this.queryParams.isAdd.findIndex(item=>{
            return item == val
          })
          if(index5!=-1){
            this.queryParams.isAdd.splice(index5,1)
          }else{
            this.queryParams.isAdd.push(val)
          }
          
        }
      }
      this.getSelectedTotal()
    },
    isFind(val){
      if(this.isFetch){
          var index = this.selected.findIndex(item=>{
          return item == val
        })
        if(index!=-1){
          console.log(val)
            this.queryParams.isDelete.push(val)
             this.selected.splice(index, 1)
        }else{
          var index2 = this.queryParams.isDelete.findIndex(i=>{
            return i == val
          })
          if(index2!=-1){
            this.queryParams.isDelete.splice(index2, 1)
          }else{
            var index3 = this.queryParams.isAdd.findIndex(m=>{
              return m == val
            })
            if(index3!=-1){
               this.queryParams.isAdd.splice(index3,1)
            }else{
              this.queryParams.isAdd.push(val)
            }
          }
        }
        this.isFetch = false
      }else{
        var index3 = this.queryParams.isAdd.findIndex(m=>{
              return m == val
            })
            if(index3!=-1){
              this.queryParams.isAdd.splice(index3,1)
            }else{
              var index2 = this.queryParams.isDelete.findIndex(i=>{
                return i == val
              })
              if(index2!=-1){
                 this.queryParams.isDelete.splice(index2, 1)
              }else{
                // this.isFetch = true
                // this.getFunInfo()
                var index = this.selected.findIndex(item=>{
                  return item == val
                })
                if(index!=-1){
                  var index4 = this.queryParams.selected.findIndex(item=>{
                    return item == val
                  }) 
                  if(index4!=-1){
                    var a = {
                      reportId:this.reportId,
                      patentNo:val
                    }
                    this.$api.deleteCompareNo(a).then(response=>{
                      if(response.code == 200){
                        // this.getList()
                         this.queryParams.selected.splice(index4,1)
                      }
                    })
                  }else{
                    this.queryParams.isDelete.push(val)
                     this.selected.splice(index, 1)
                  }
                }else{
                  this.queryParams.isAdd.push(val)
                }
              }
            }
        }
    },
 
    getRowKeys(row) {
      return row.id
    },
    async handleCurrentChange(val) {//分页
      this.queryParams.current = val;
      // this.checkList = []
      // this.queryParams.endNumber=0
     await this.getList();
      if(this.quickSelect){
        this.commonSwitch()
      }
      
    },
    
    savePatentList() {//保存
      let add = {
       isDelete:this.queryParams.isDelete,
       isAdd:this.queryParams.isAdd,
       startNumber:this.startNumber,
       endNumber:this.endNumber,
       reportId:this.reportId
      }
      // console.log(add)
      this.$api.addFTOCompareFile(add).then(res => {
          console.log(res);
          if (res.code==200) {
            this.startNumber = 1
            this.endNumber = 0
            this.selectedTotal = 0
            this.quickSelect = false
            this.queryParams.isAdd=[]
            this.queryParams.isDelete=[]
            this.checkList = []
            this.getList()
            this.$message({
              message: '保存成功',
              type: 'success'
            });
            // this.$emit("save", true);
          }
        })
      // if (add.patentNos.length>0) {
      //   this.$api.addCompareFile(add).then(res => {
      //     console.log(res);
      //     if (res.code==200) {
      //       this.$emit("save", true);
      //     }
      //   })
      // } else {
      //   this.$confirm('您未做勾选!点击确定将会进行下一步!', '温馨提示',  {
      //       confirmButtonText: '确定',
      //       cancelButtonText: '取消',
      //       type: 'warning'
      //   }).then(() => {//
      //     this.$emit("save", true);
      //   }).catch(() => {
                  
      //   });
      // }
     
      
    },
    getList2() {
      this.queryParams.current = 1
      this.getList()
    },
   async getList(key) {
     this.queryParams.reportId = this.reportId
     let params = JSON.parse(JSON.stringify(this.queryParams))
      console.log(params);
      params.tree.map(tree => {
        let field = params.field.filter(item => item.key === tree.key)
        if (field.length === 0) {
          params.field.push(tree)
        }
      })
     params.tree = undefined
     console.log(params);
      this.$store.commit('SET_PATENT_PARAMS', params)
     await this.$api.getCompareFile(params).then(response => {
        this.loading = false
        this.total = response.data.datas.total
        // this.queryParams.endNumber =this.queryParams.endNumber==0? response.data.datas.total:this.queryParams.endNumber
        this.queryParams.endNumber =response.data.datas.total
        
        this.tableData = response.data.datas.records
        this.queryParams.selected = response.data.select
        this.queryParams.selectedTotal = response.data.selectedTotal
        // this.checkList =JSON.parse(JSON.stringify(this.queryParams.selected)) 
        this.checkList =JSON.parse(JSON.stringify([...new Set(this.checkList.concat(this.queryParams.selected))])) 
        this.selected = this.checkList
        this.isFetch = true


      
      }).catch(error => {

      })
    },
    showPatent(even) {//选择下拉框
      console.log(even);
    },
  },
  watch: {
    ChosePatentSure(val) {
      if (val) {
        if(this.queryParams.selectedTotal>0){
          console.log(val)
          if(this.selectedTotal>0){
             this.savePatentList()
          }
          
           this.$nextTick(_=>{
            this.$emit("save", true);
           })
          
        }else{
          this.$confirm('您未做勾选!点击确定将会进行下一步!', '温馨提示',  {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            this.$emit("save", true);
          }).catch(() => {
            this.$emit("save", false);    
          });
        }
       
      }
    },
    
  }
}
</script>

<style lang="scss" >
.btn1 {
  background: #909399;
}

.btn1:hover {

  background-color: #a4a7ab;
}

.patent-fast-edit-popover {
  padding: 0 !important;

  .btn {
    color: #000;
    line-height: 40px;
    border-radius: 5px;
    padding-left: 10px;
    cursor: pointer;

    &:hover {
      background: #adadad;
      color: #fff;
    }
  }

  .disabled {
    cursor: not-allowed !important;
  }

  .bottom {
    text-align: right;
    color: #1e9fff;
    line-height: 40px;
    padding-left: 10px;
    font-size: 18px;
  }

  .el-divider--horizontal {
    margin: 10px 0 !important;
  }

  .select-number {
    .el-input {
      width: 70px;
    }

    span {
      padding: 0 3px;
    }
  }

}
.patent-left{
  margin-top: 69px;
  overflow: hidden;
  border-top: 1px solid rgb(228 231 237);
}
</style>