<template>
  <div style="padding:20px">
    <div style="display: flex; justify-content: space-between;">
      <div :style="{ visibility: selectedTotal > 0 ? 'visible' : 'hidden' }">
        已勾选 <b>{{ selectedTotal }}</b> 条
      </div>
      <div style="display: flex;padding-bottom: 20px;">
        <el-input v-model="params.patentNo" size="small" placeholder="请输入专利号进行查询（多个专利号查询中间请用符号“|”隔开）"></el-input>
        <el-button type="primary" size="small" @click="getList">查询</el-button>
      </div>
      
      <div style="display:flex;justify-content: flex-end;padding-bottom:20px">
        <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-button type="primary" size="small" @click="savePatentList" :loading="btnLoading">保存</el-button>
      </div>
    </div>
    <!-- 数据表格 -->
    <el-table :data="tableData" border :row-key="getRowKeys"  ref="table" id="table"
      header-row-class-name="custom-table-header" 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-dialog title="筛选" :visible.sync="visible" width="1200px" max-height="800" :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="sure">确 定</el-button>
      </div>
    </el-dialog>

  </div>
</template>
<script>

export default {
  components: {
  },
  props: ['productId'],
  data() {
    return {
      btnLoading: false,
      loadPatent: false,
      selectedTotal: 0,
      isFetch: true,
      quickSelect: false,//是否快速选择
      loading: true,
      visible: false,
      selected: [],
      checkList: [],//回显
      tableData: [],
      total: 0,
      form: {},
      formS: {},
      startNumber: 1,
      endNumber: 0,
      Params: {
        current: 1,
        size: 10,
      },
      params:{},
      queryParams: {
        state: 0,
        patentNos: [],//原isAdd
        notInPatentNos: [],//原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: [],
        pasOptions: [],//专题库自定义字段
      },
      mergeArr: ['id', 'patentNo'],
      mergeObj: {},
      selectNumberLoading: false,
    }
  },
  created() {

  },
  mounted() {
    // this.getList()
  },
  methods: {
    //子页面自定义字段值
    onChangeList({ field, a }) {
      // console.log(field,a);
      this.queryParams.pasOptions = field
      this.queryParams.projectId = a
      this.handleCancelSelectNumber()
      this.getList2()

    },
    getListPro() {
      //console.log("进来");
      this.tableData = []
      this.$api.getPatentListPAS(this.queryParams).then(res => {
        this.tableData = res.data.records
        this.total = res.data.total
      })
    },
    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]
        }
        this.handleCancelSelectNumber()
        this.getList2()
      }
      this.visible = false
    },
    close() {
      this.visible = false
      this.form = this.formS
    },
    getSelectedTotal() {
      //console.log(this.queryParams.patentNos,this.queryParams.notInPatentNos);
      this.selectedTotal = Number(this.endNumber) - Number(this.startNumber) + 1 + Number(this.queryParams.patentNos.length) - Number(this.queryParams.notInPatentNos.length)
    },
    async 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.selected = []
          if (!this.quickSelect) {
            this.queryParams.patentNos = JSON.parse(JSON.stringify(this.checkList))
            this.getSelectedTotal()
            break;
          }
          this.tableData.forEach((item, index) => {
            var position = (this.queryParams.current - 1) * this.queryParams.size + index + 1
            if (position >= this.startNumber) {
              if (this.endNumber >= this.queryParams.current * this.queryParams.size) {
                var index1 = this.queryParams.notInPatentNos.findIndex(i => {
                  return i == item.patentNo
                })
                if (index1 != -1) {
                  this.queryParams.notInPatentNos.splice(index1, 1)
                }
              } else {
                if (position <= this.endNumber) {
                  var index1 = this.queryParams.notInPatentNos.findIndex(i => {
                    return i == item.patentNo
                  })
                  if (index1 != -1) {
                    this.queryParams.notInPatentNos.splice(index1, 1)
                  }
                } else {
                  var index2 = this.queryParams.patentNos.findIndex(i => {
                    return i == item.patentNo
                  })
                  if (index2 == -1) {
                    this.queryParams.patentNos.push(item.patentNo)
                  }
                }
              }
            } else {
              var index2 = this.queryParams.patentNos.findIndex(i => {
                return i == item.patentNo
              })
              if (index2 == -1) {
                this.queryParams.patentNos.push(item.patentNo)
              }
            }
          })
          this.getSelectedTotal()
          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.notInPatentNos = []
          this.queryParams.patentNos = []
          if (type == 2) {
            if (!Number(this.queryParams.startNumber) || !Number(this.queryParams.endNumber)) {
              this.queryParams.endNumber = this.endNumber > 0 ? this.endNumber : this.total
              this.queryParams.startNumber = this.endNumber > 0 ? this.startNumber : 1
              break;
            }
            this.startNumber = this.queryParams.startNumber
            this.endNumber = this.queryParams.endNumber

          }

          // this.checkList =JSON.parse(JSON.stringify(this.queryParams.selected)) 
          this.checkList = []
          this.queryParams.notInPatentNos = []
          this.queryParams.patentNos = []
          await 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.startNumber) {
        if (this.queryParams.size * this.queryParams.current >= this.endNumber) {
          if (this.queryParams.size * (this.queryParams.current - 1) + 1 <= this.startNumber) {
            var a = this.startNumber - (this.queryParams.size * (this.queryParams.current - 1) + 1)
            var b = this.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.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.startNumber) {
            var a = this.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.notInPatentNos.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.notInPatentNos.findIndex(m => {
          return m == patentNo
        })
        if (index3 != -1) {

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

      }


    },
    handleSelectNumber(type) {

      this.Switch(type)

    },

    handleCancelSelectNumber() {//取消选择
      this.queryParams.selected = []
      this.queryParams.patentNos = []
      this.queryParams.notInPatentNos = []
      this.checkList = []
      this.quickSelect = false
      this.startNumber = 1
      this.queryParams.startNumber = 1
      this.queryParams.endNumber = this.total
      this.endNumber = 0
      this.selectedTotal = 0
      // this.getList()
    },
    getFunInfo(val) {
      //console.log(this.quickSelect);
      if (this.quickSelect) {
        var index4 = this.queryParams.selected.findIndex(item => {
          return item == val
        })
        if (index4 != -1) {
          var a = {
            productId: this.productId,
            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 = {
            productId: this.productId,
            patentNo: val
          }
          this.$api.deleteCompareNo(a).then(response => {
            if (response.code == 200) {
              this.getList()
            }
          })
        } else {
          var index5 = this.queryParams.patentNos.findIndex(item => {
            return item == val
          })
          if (index5 != -1) {
            this.queryParams.patentNos.splice(index5, 1)
          } else {
            this.queryParams.patentNos.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.notInPatentNos.push(val)
          this.selected.splice(index, 1)
        } else {
          var index2 = this.queryParams.notInPatentNos.findIndex(i => {
            return i == val
          })
          if (index2 != -1) {
            this.queryParams.notInPatentNos.splice(index2, 1)
          } else {
            var index3 = this.queryParams.patentNos.findIndex(m => {
              return m == val
            })
            if (index3 != -1) {
              this.queryParams.patentNos.splice(index3, 1)
            } else {
              this.queryParams.patentNos.push(val)
            }
          }
        }
        this.isFetch = false
      } else {
        var index3 = this.queryParams.patentNos.findIndex(m => {
          return m == val
        })
        if (index3 != -1) {
          this.queryParams.patentNos.splice(index3, 1)
        } else {
          var index2 = this.queryParams.notInPatentNos.findIndex(i => {
            return i == val
          })
          if (index2 != -1) {
            this.queryParams.notInPatentNos.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 = {
                  productId: this.productId,
                  patentNo: val
                }
                this.$api.deleteCompareNo(a).then(response => {
                  if (response.code == 200) {
                    // this.getList()
                    this.queryParams.selected.splice(index4, 1)
                  }
                })
              } else {
                this.queryParams.notInPatentNos.push(val)
                this.selected.splice(index, 1)
              }
            } else {
              this.queryParams.patentNos.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() {//保存
      this.saveDeleteQueryParams()
      this.btnLoading = true
      this.$api.addPatentDelete(this.queryParams).then(res => {
        if (res.code == 200) {
          this.btnLoading = false
          this.saveDelete()
          this.$message.success('保存成功')
        }
      })
    },
    saveDeleteQueryParams() {
      this.queryParams.startNumber = this.startNumber
      this.queryParams.endNumber = this.endNumber
      this.queryParams.productId = this.productId
    },
    saveDelete() {
          this.startNumber = 1
          this.endNumber = 0
          this.selectedTotal = 0
          this.quickSelect = false
          this.queryParams.patentNos = []
          this.queryParams.notInPatentNos = []
          this.checkList = []
          this.getList2()
    },
    getList2() {
      this.queryParams.current = 1
      this.getList()
    },
    async getList(key) {
      // this.queryParams.productId = this.productId
      // 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)
      // this.loading = true
      
      await this.$api.getPatentsDTOById(this.params).then(response => {
        this.loading = false
        this.total = response.data.total
        this.queryParams.endNumber = this.endNumber > 0 ? this.endNumber : response.data.total
        this.queryParams.startNumber = this.endNumber > 0 ? this.startNumber : 1

        this.tableData = response.data.records
        // this.queryParams.selected = response.data.select
        // this.queryParams.selectedTotal = response.data.selectedTotal
        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: {
  }
}
</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>